I have a site I am developing where a page will advance to a different page within an iframe after so many seconds. I have a manual version where you have to click next. I am developing an auto version where it would advance to the next page after so many seconds. Using document.forms["advance"].submit(); where advance is the name of the form for the "next" button.
The manual version always works when clicking "Next". The auto version, using the code above will advance, but sometimes displays a blank page in the frame instead of what should be the next page. When the timer is done, it will then advance to the next page; sometimes another blank page, sometimes the proper page. There seems to be no rhyme or reason to it. Not every other page or two or three blank pages in a row. Completely random.
I think I have it figured out. Came down to the human hand (manual) versus autosubmit. Autosubmit needed some type of delay to let scripts load prior to the page refresh. So instead of using this:
document.forms["advance"].submit();
Changed it to this:
setInterval(function(){document.forms["advance"].submit()},2000);
I guess a two second delay prior to the autosubmit made all the difference.
Related
I'm looking for a way to recreate the functionality of a refreshing page extension on a browser (e.g. Auto refresh plus in Chrome) by using javascript. The problem is that I have no ideia how to achieve that.
I must find a way to refresh the page every second or so, click on a link that appears on the page from time to time, add a sound effect for when it appears and send an e-mail notification every time it appears.
I'm trying to use a simple javascript snippet to run in the console in order to refresh the page:
win1 = window.open("https://www.myUrl.com/");
timer1 = setInterval(function(){win1.location.href="https://www.myUrl.com/"}, 1500);
However, this implies running code from tab A on tab B which I found very challenging.
The code can't run on tab A alone because at the time it refreshes the page, it gets erased from the console.
I know it would have been so much easier to use an extension, but the platform I work for does not allowed any extensions.
I have basic HTML and javascript knowledge, but I find this would be a good project to learn more.
Also, if the solution involves other languages, I just need a direction to know where to look for and start this project.
Posting without a target so that a web page reloads seems useful behaviour for some things - such as writing a login page. I have implemented a calendar in PHP which takes advantage of this. It reloads an object from the session (or creates a new one if not present), applying any changes that result from the post then saves the object back to the session. The problem is this. If I hit the back button I don't want to go back through every click of the calendar button but would rather jump back to the page before arriving at the calendar page. Not only that, if I do go back one calendar page after another I get an annoying "confirm form resubmission". I have implemented an incrementing value after the # for each post so that I might be able to use window.onhashchange. The problem is that window.onhashchange never fires so I am unable to intercept the back button and pop the history stack. Any ideas? Am I better off coding on the server side with javascript?
Well I solved one problem. My form subclass in PHP defaults to using POST as I understand this is more secure. This causes the annoying resubmission problem when using the back button. I now use GET in my calendar page which solves this issue. I am still bemused by JS debugging in Netbeans. I have never got script to stop on a breakpoint within a single document. I have previously had it working with an external javascript source but this no longer works. If I can output to console but there is no window in which to see the output. I am told window.alert no longer works for some events in Chrome. I am completely blind! To add to the irritation, it took me a while to realize was that the javascript file was cached and changes would not be reflected in behaviour. I have put a random number into the script tag which fixes this issue. As I am debugging using netbeans connector in Chrome I have no idea why this does not force the js file to refresh. All in all, this appears to be a pretty shambolic toolchain.
I have a bookmark that opens my a google calendar page (http://www.google.com/calendar/renderOnline) and a bookmarklet that applies some javascript on it:
javascript:document.getElementById('gadgetcell').setAttribute('style','width:300px');document.getElementsByClassName('sn-frame')[0].setAttribute('style','width:300px');
Is there a way to combine these into a single bookmarklet so that i don't have to click twice all the time?
Thank you!
No. A bookmarklet runs in the context of the original page, so it can't change pages and keep running. You may find GreaseMonkey helpful if you always want to run that code on the page. Or, Stylish lets you apply user styles to pages.
You could use an extension to get the same behavior.
For example in Safari you would create a button that launches the URL and an injected script that runs your bookmarklet. GreaseMonkey and many other extensions frameworks can do similar things.
I had the thought to use a bookmarklet to do this:
javascript:location.href='http://google.com';setTimeout(function(){alert('hi');},2000);
The setTimeout function could be anything, and due to the 2 second timer, the page would have time to load and the arbitrary code would execute against it. But it didn't work. No matter what function I seem to try to call in the setTimeout, it just never executes, or perhaps it executes in some other space that was being destroyed as the new page loaded or something like that. That setTimeout code works fine as a bookmarklet as long as there's no location.href change, it seems.
However I wonder if perhaps a better approach would be to do an AJAX load of the page you want into the current space, and then try to execute something. If I get around to trying that I'll update here.
I am making a greasemonkey script and i would like a link to go forward and modify the current html and allow the user to click back to go to the original page.
How might i do this? using jquery + greasemonkey + javascript. Targeting firefox mostly.
-edit- http://jsfiddle.net/ seems to do it. If you write random html in the html section, hit run, change the html and hit run again. You'll be able to click back/forward to see the output change (however the html input box stays the same). I am using firefox to view this. Thats the effect i want.
it appears the magic is done on line 91. Is this submitting a form in a frame (perhaps the results frame?) and that is causing the movement in history?
88 run: function(e) {
89 e.stop();
90 Layout.updateFromMirror();
91 document.id(this.options.formId).submit();
92 this.fireEvent('run');
93 },
I don't know if that is possible at all because it is the browser itself that takes care of the navigation history. A new history item is added only when you visit a new page.
If I am not wrong you would like the user to turn on/off the changes you make to the page without enabling/disabling greasemonkey and reloading the page.
The only solution I see for this is to take care of it yourself. Save any changes you make to the page so that you can restore it and add some UI to the page to make the user turn on or off your changes.
EDIT 1:
It seems that jsfiddle.net loads a new page to do that. Using firebug you can see it is not doing any AJAX request to run the code, it is just loading a new page (maybe the same page, with different parameters, but nevertheless it is loading a page.)
EDIT 2:
Yes, maybe it is loading the page in a frame. As you can see from the HTML:
<iframe name='result' frameBorder='0'></iframe>
But this does not change your situation. If you want your logic to be in your greasemonkey script you can't load a new page. Otherwise you should upload a web page somewhere and make it load in an iframe passing it the HTML you want to modify: this is definitely not what you want to do.
It sounds like you want to use a history manager. You could either track the changes you make and undo them when the user goes back, or possibly call a page refreshing function.
I have a bookmark that opens my a google calendar page (http://www.google.com/calendar/renderOnline) and a bookmarklet that applies some javascript on it:
javascript:document.getElementById('gadgetcell').setAttribute('style','width:300px');document.getElementsByClassName('sn-frame')[0].setAttribute('style','width:300px');
Is there a way to combine these into a single bookmarklet so that i don't have to click twice all the time?
Thank you!
No. A bookmarklet runs in the context of the original page, so it can't change pages and keep running. You may find GreaseMonkey helpful if you always want to run that code on the page. Or, Stylish lets you apply user styles to pages.
You could use an extension to get the same behavior.
For example in Safari you would create a button that launches the URL and an injected script that runs your bookmarklet. GreaseMonkey and many other extensions frameworks can do similar things.
I had the thought to use a bookmarklet to do this:
javascript:location.href='http://google.com';setTimeout(function(){alert('hi');},2000);
The setTimeout function could be anything, and due to the 2 second timer, the page would have time to load and the arbitrary code would execute against it. But it didn't work. No matter what function I seem to try to call in the setTimeout, it just never executes, or perhaps it executes in some other space that was being destroyed as the new page loaded or something like that. That setTimeout code works fine as a bookmarklet as long as there's no location.href change, it seems.
However I wonder if perhaps a better approach would be to do an AJAX load of the page you want into the current space, and then try to execute something. If I get around to trying that I'll update here.