Javascript navigation only works on debug - javascript

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!

Related

Not able to refer JavaScript from outside file

I am new to Spring and JavaScript.
I have created a JSP file
In my first.js ,I have the following method
function firstmethod()
{
window.alert("Enter a New Number");
return true;
}
But the javascript method is not getting executed.I couldn't figure out the reason.Please suggest
The browser console error log is
Console Error log
I would first check to see if the file is showing up in your web browser correctly:
Right-click in browser window, choose "View Page Source (if you're using chrome)," navigate to the tag, find the link to your javascript file and click on it. You should see the contents of it display in your window.
If the code looks right, you might have an error in it. The browser developer tools (right-click browser window, select "Inspect Element") will sometimes display those errors in the "Console" tab.
The code seems fine. Here's a snippet for it:
function firstmethod()
{
alert("Enter a New Number");
return true;
}
<form name="firstform" method="post" action="first" onsubmit="return firstmethod()">
<input type="submit" name="button" value="Click" />
</form>

window.open how to open self in Mozilla and IE

so I´m trying to make window.open function work, however I am not able to see it working correctly in Mozilla neither in IE, in both is opening a new tab, however it works correctly in Chrome,.. Here´s the thing:
<input type="submit" value="<%=I18n._("Register")%>" onclick="window.open('http://url.com')" class="button" />
I´ve tried almost everything I guess: location.href, window.self.. etc but nothing seems to work. How can I open this in self?
Thanks in advance.
You are canceling the navigation by submitting the form. You can do the following to prevent the default action (submit the form) and do the navigation instead:
<input type="submit" onclick="window.location.href='http://url.com'; return false;" class="button" />
I removed the value because you're not submitting the form anyway. Feel free to put it back if you use it for anything else, it shouldn't break anything.

Iframe and firefox problems

I am designing a simple Rich Text Editor using HTML/Javascript. It uses iframe. While it is working great in IE6 (and possibly newer IE versions), it is broken in FireFox. The iframe cannot be edited or used in any way.
The HTML <body>
<input type="button" id="bold" class="Button" value="B" onClick="fontEdit('bold');">
<input type="button" id="italic" class="Button" value="I" onClick="fontEdit('italic');">
<input type="button" id="underline" class="Button" value="U" onClick="fontEdit('underline');">
<hr>
<iframe id="TextEditor" class="TextEditor"></iframe>
The Javascript (for IE)
TextEditor.document.designMode="on";
TextEditor.document.open();
TextEditor.document.write('<head><style type="text/css">body{ font-family:arial; font-size:13px; }</style> </head>');
TextEditor.document.close();
TextEditor.focus();
The above script makes iframe editable in IE. Fails to do so in FF. So I changed a few things for FF version-
The Javascript (for FF)
id("TextEditor").contentWindow.designMode="on";
id("TextEditor").contentWindow.open(); //this line is responsible for pop-ups
id("TextEditor").contentWindow.write('<head><style type="text/css">body{ font-family:arial; font-size:13px; }</style> </head>'); //this line throws error: id("TextEditor").contentWindow.write is not a function at the FF debug console.
id("TextEditor").contentWindow.close();
id("TextEditor").focus();
This section of code makes FF provoke an pop-up alert with a blank page as a target. It's still broken. What now follows are general functions for things like id() and fontEdit()-
function fontEdit(x,y){
TextEditor.document.execCommand(x,"",y);
TextEditor.focus();
}
function id(id){
return document.getElementById(id);
}
function tag(tag){
return document.getElementsByTagName(tag);
}
I'm sure FF doesn't handle iframe this way. So how do I get iframe to be used as a Rich Text Editor and without showing pop-ups. Please try your best to avoid jQuery since I'm not that good in it yet. Which is why the custom functions like id() and tag() exists.
And, I'm aware that there are other freely available Text Editors for me to download and use so please do not suggest me any such solutions and do not ask me why I must re-invent the wheel. Only answer if you know where I am going wrong and if you can actually help me fix the problem.
FF provoke an pop-up alert with a blank page as a target because you are calling the function window.open, instead you shoud call document.open.
window.open: opens a new browser window.
document.open: It opens an output stream to collect the output from any document.write() or document.writeln() methods. Once all the writes are performed, the document.close() method causes any output written to the output stream to be displayed.
Note: If a document already exists in the target, it will be cleared.
See The open() method
This should works for you:
id("TextEditor").contentWindow.document.designMode="on";
id("TextEditor").contentWindow.document.open(); //this line is responsible for pop-ups
id("TextEditor").contentWindow.document.write('<head><style type="text/css">body{ font-family:arial; font-size:13px; }</style> </head>'); //this line throws error: id("TextEditor").contentWindow.write is not a function at the FF debug console.
id("TextEditor").contentWindow.document.close();

Executing Commands Javascript

I want to execute a command by the click of a button, and not when the page loads.
function hey() {
alert('bla');
}
Do I add something to the code above or to the button?
<input type="button" value="Click Me" onclick="hey()" />
Have you taken the time to type in your question into the magical Google box yet? Surely you'll see something like this:
<input type="button" value="Click me, now" onclick="hey()" />
Say you have the function that alerts a window to the user.
<script type="text/javascript">
function showMe() {
alert('You clicked on the button');
}
</script>
<button onclick="showMe()">Button</button>
This will make sure that the function is only called when the button is clicked upon and not when the page is loaded.
Okay, so you have a code that should work for alerting something on the click of a button. But you state that the code is running on page load. You have to check you code, looking for:
An onload attribute on the body tag, something like <body onload="hey()">
A call to hey somewhere else on your js code. Look for hey().
Maybe a reference to the button followed by a call to .click()
There is something else on your code causing the function to be called, you'll have to scan your code to find out what it is.

Javascript URL inside an iframe does not execute in Firefox

I have written this code for Firefox:
<html><head><title>No</title>
<script type="text/javascript" src="jquery-1.4.2.js"></script>
</head>
<body>
<form action="javascript:void(alert('Yes'));">
<input type="submit" value="Submit">
</form>
<script>$($('form').submit())</script></body></html>
It correctly displays the alert box.
However, when i run this inside an iframe, with this code:
<html><body><iframe src="click.php"></iframe></body></html>
i don't get the alert box, not even if i click the submit button myself.
What is going on exactly? The same code works in Chromium
Well, don't do that then!
It doesn't make any sense to submit a form to a javascript: URL. Use a submit event handler to pick up the form submission and execute script, eg using jQuery:
$('#someform').submit(function() {
alert('Yes');
return false;
});
A good rule of thumb about when to use javascript: URLs is: never.
It looks like it's a problem with FF4 so I'll discuss it on their bugzilla if it's really their fault. I have modified the source so I'm not even sure it is a bug...

Categories

Resources