Develop Reference

Javascript navigation only works on debug

I have a button which calls a Javascript function when it is pressed, that function is just redirecting to another page, it looks like this:
<input type="submit" value="Submit" id="button1" name="button1" onclick="myFunction()" />
And the function looks like this:
function myFunction() {
window.location.href = "page2.html";
}
The function is executed but the redirection does not work, it remains on the same page, but if I set a breakpoint on the function and execute it line by line using the Browser dev tools it successfully redirects to the other page.
---------EDIT---------
It works only using the Firefox dev tools, if I set the breakpoint on Chrome it still does not works.

Try setting the href to just
location.href = "page2.html".
As IE and Firefox are concerned, "/path" is invalid.
"Sorry, cannot leave comment yet"

It's the nature of your input type. Change the type to "button" and you'll be good to go!

Trying to get a button to work as a submit button

I am trying to figure out how to make this HTML submit button work correctly. Below is the code for the submit button:
<form action ="itms-services://?action=download-manifest&url=https://icustomer.apsresource.com/ipad_apps/survey/user/APSSurvey.plist">
<button type="submit" name="Download" value="download" onclick="JavaScript:alert('You will be downloading the APS Resource iPAD PRODUCT SURVEY.')" style="width:255px; height:310px; -webkit-appearance: none; -webkit-border-radius:0px;">
<img src="apple.png" />
</button>
</form>
When the button is clicked, it is supposed to open up the URL in the "action" part in the form tag. However, all I get is the JS pop-up, but no URL is opened (looking at the console, a GET function is triggered, then instantly canceled). IS there something I need to add/remove in order for this to work?

Submit the form with the onclick event
onclick="alert('You will be downloading the APS Resource iPAD PRODUCT SURVEY.');this.form.submit();"
You don't need to put the work JavaScript in your event either.
BTW, you don't really need to have this.form.submit() at all. I took your original and removed JavaScript from the onlick and changed the action and your code works fine. I'm not sure what itms-services:// is but it's not a valid HTTP protocol like http:// or https://.
Here's a jsfiddle illustrating this.

iOS7 html form softkey Go button does nothing when onsubmit uses javascript window.open

I need to submit form data in a _blank window to a URL that contains a couple different question marks in this format:
http://first--sample--url.com?http://second--sample--url.com?a=someUserInput&b=moreUserInput
The first URL does not allow requests sent with the POST method. Trying a form submission using a standard GET method, the URL is truncated after the first question mark, and I can't move the second URL to a hidden form field since it is not a name/value pair.
When testing the below code on the iOS6 simulator, it works fine -- both the submit button and the iOS softkey "Go" button (that appears on the soft keyboard while inputting text) execute the window.open call as intended.
Testing on iOS7 devices however, the softkey "Go" button does not allow the window.open to happen, even though the submit button works:
<form onsubmit="clickThrough(); return false;">
<input type="text" name="a" id="a">
<input type="text" name="b" id="b">
<input type="submit">
</form>
<script>
var url = "http://first--sample--url.com?http://second--sample--url.com?a={a}&b={b}",
a = document.getElementById('a'),
b = document.getElementById('b');
function clickThrough() {
var clickURL = url.split("{a}").join(a.value).split("{b}").join(b.value);
window.open(clickURL, "_blank");
}
</script>
Test the fiddle here on iOS7: http://jsfiddle.net/BC2Vv/5/embedded/result/
And edit the fiddle here: http://jsfiddle.net/BC2Vv/5/
Does anyone know a workaround for this in iOS7 so the softkey "Go" button will allow window.open to complete, or do you have any other solutions?
Thanks in advance!

HTML Input type image won't redirect upon click?

I have the following code, which works fine:
<input type="button" name="btnHello" value="Hello" onclick="Test();"/>
and here is the JS function:
function Test() {
window.location.href = "Page2.aspx";
}
When I click my Hello button, it redirects to Page2.aspx like expected. But when I change my button to an image button:
<input type="image" src="images/myimage.jpg" name="btnHello" onclick="Test();"/>
It no longer works. The page posts back, but its more like a refresh. I can put an alert in the JS function to see that it is getting called, but I'm not sure why the redirect doesn't work? Has anyone ever experienced this?
I know its probably something stupid, but I'm stumped.
Many thanks in advance!

You need to return false from the event handler to prevent the default action.
However, since you don't want it to postback in the first place, you might as well use an ordinary <img /> instead of an <input />.

The redirect is getting cancelled because you are doing a postback. Add return false; after the function test();
e.g
onclick="test();return false;"

Try using an img tag:
<img src="images/myimage.jpg" name="btnHello" onclick="Test();"/>

input type image does not have a onclick event. You need to use the img tag instead.
<img onclick="Test();">

jquery .click form submit not working in ie8 or below-

im having trouble with a form submit script im using with javascript and jquery- its a form i have loaded into a facebook tab which when submit should pass a variable to another tab.
it works in ie9, chrome, ff and safari but client is stuck on ie 7 and 8. I dont know what the problem is- I have tried replace the button with a div and image incase .click wouldnt overwrite the submit function.
this should be a common problem with fix? or what am i doing thats completely wrong?
<script>
$('document').ready( function(){
$('#my_button').click(function (e) {
//this.form.onsubmit();
var_app = "444444";
url = "http://www.facebook.com/tab/?sk=bladadasd&app_data=" + var_app;
parent.window.location.replace(url);
e.preventDefault();
return false;
});
});
</script>
<form id="submit" method="POST" >
<ul>
<li><span>Photo code <sup class="required">*</sup></span><input id="barcode" name="barcode" type="text"/></li>
<li><span>First name</span><input id="firstName" name="firstName" type="text"/></li>
<li><span>Last name</span><input id="lastName" name="lastName" type="text"/></li>
<li><span>Email address</span><input id="optional_email" name="optional_email" type="text"/></li>
</ul>
<a class="help">Need help?</a>
<input value="" type="submit" id="my_button" />
</form>
edit the form bounces on to the correct page in normal browsers but in ie8 it just submits upon itself going nowhere and displaying the same again

If it is a submit button , then instead you should be working with onsubmit even on that form.
P.S. why is your var_app variable in global scope ?

Try the submit event instead of click event.
$('#my_button').submit(function(event) {
event.preventDefault();
});
You are also missing an action for your form.
I wonder if you should also specify the script type

Declare var_app & url variables.
var var_app = "444444";
var url = "http://www.facebook.com/tab/?sk=bladadasd&app_data=" + var_app;

The error lay with the line
parent.window.location.replace(url);
internet explorer only allowed the following statement and would throw a permission error
parent.location.replace(url);
nothing to do with jquery or my form syntax :( only realised this when i ran the code on a different machine in ie7