I have some jQuery and javscript code in my html file. I am displaying an alert message in $(document).ready function. The problem is that the alert message box is disposing itself even I did not click "OK". The box hides itself after almost a second.
Here is the code summary:
This summarized code works fine when placed independently when placed in a single html file. I have an html file with lots of coding in it and I am unable to find the cause of the error. Can someone tell me why an alert box behaves like this? Could this be a syntax error or something else like a logical error in my code?
I have removed other scripts to test if they conflict with each other.
<html>
<head>
<script
src='http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js'
type='text/javascript'/>
</head>
<body>
.........rest of the body ...............
<script>
$(document).ready(function() {
alert("Test");
});
</script>
</body>
</html>
The alert message box should not disappear without the "OK" button click.
Related
I'm trying to set up a page that calls an external Javascript function when the user presses a button in an html form. The function name is lock(), and my code for the button is as follows:
<form>
<button type="button" onclick="lock()">Pause/Play</button>
</form>
Trying to run the code gives the following error:
The value of the property 'lock' is null or undefined, not a Function object
I have confirmed that the function I'm trying to call is a global one in the scope of the .js file, and I know that the .js file is being loaded when the page starts because all of the functionality except for this button works. Am I missing any obvious steps and, if not, what do I need to verify? Thanks.
if you open up dev tools, such as f12 in chrome, and enter lock in console, does it return the function? or undefined?
its impossible ot tell whats going on without seeing your code.
a few things you can try:
1.Include the script tag right above the closing tag of the body, to ensure that the script is loaded after the button.
Attach the event handler to the button not inline, but in the domcontentloaded event.
to debug, try calling some other function from same button, to islotate the problem, and vice versa, try attaching the function to a different button, see if it works there.
Where did you have the javascript line in your html that calls the function from other source? If you had that plotted inside <head></head>, then try move the line way further to below in your html file like right before </body> like as for example:
<html>
<head>
<title>My HTML</title>
</head>
<body>
<blah></blah>
<script type="text/javascript" src="myexternal.js"></script>
</body>
</html>
I have some input field, and I call this in my js file
$(document).ready(function () {$('#input_id').focus(); });
but it doesn't launch. Even, when I launch it in my chrome console, I get no focus. How can it be
This is working sample for a text input, just match with your page code and see what you are missing as compared to this.
I assume that you have referred jquery js already and any other jquery functions work well in your page.
<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">
</script>
<script>
$(document).ready(function ()
{
$('#input_id').focus();
});
</script>
</head>
<body>
<input type="text" id="input_id"/>
</body>
</html>
In any case please make sure that there is no js error in your page as
$('#input_id').focus(); must work fine individually, so only thing looks wrong could be reference to jquery, else some js error before code reaches to .focus() call on input_id.
Also you can validate if on your page focus for the input working fine, for this keep $('#input_id').focus(); in a script tag just before your body page ends/closes,
to make sure input control, jquery reference are placed correctly and page has no js errors, if this way too focus doesn't work then something is wrong with any of these 3.
1) Here is what works just fine:
SearchTool.aspx (in the code snippet below) is a 3rd party product that will actually insert an iframe into the page at page load time with the search tool inside of it.
<html>
<head>....</head>
<body>
...
...
<h2>Search Tool</h2>
<script type='' src='http://foo.com/SearchTool.aspx</script>
...
</body>
</html>
2) Here is what I want to do:
I want my page to load quickly without the search tool being loaded at the same time. The user can read through my page and then, if they want, they can click on a button to load the search tool thereby delaying the tool load time to when they want it.
I want to be able to invoke the SearchTool.aspx from the click of a button as below, but I don't know what the code would look like in the showSearch() function below:
<h2>Search Tool</h2>
<script type='text/javascript'>
function showSearch(){
**** What would go here? *****
}
</script>
<input .....="" onclick="showSearch();"></input>
3) I have already explored creating the iframe manually:
In the code snippet #1 above that works just fine, if I do a view source and then create an iframe exactly like they do with all of the same properties, the Search Tool doesn't completely work properly. Weird I know, but true. So this is NOT an option.
Wrap your script tag in a div with the style display:none to hide it:
<h2>Search Tool</h2>
<div id="searchTool" style="display:none">
<script type='' src='http://foo.com/SearchTool.aspx</script>
</div>
...
Then, in your function, just show it :
function showSearch(){
document.getElementById("searchTool").style.display = 'block';
}
I'm trying to test the following code in Firefox 13.0.1, but it doesn't work correctly:
<!DOCTYPE html>
<html>
<head>
<title>Exercise 1</title>
<script type="text/javascript" async src="example1.js"></script>
<script type="text/javascript" async src="example4.js"></script>
<script type="text/javascript" src="example3.js"></script>
</head>
<body>
<p>Hello world</p>
</body>
</html>
//example1.js:
alert("I'm the example 1");
//example3.js
alert("I'm the example 3");
//example4.js
alert("I'm the example 4");
When I open the file which contains the above html code, the following occurs:
I EDIT THE PROCESS I FOLLOW
In first place, the script "example3.js" is executed, and then a pop-up with the text "I'm the example 3" appears. Afterwards, I click on OK button inside the pop-up window.
In second place, the script "example4.js" is executed, and then a pop-up with the text "I'm the example 4" appears. Afterwards, I click on OK button inside the pop-up window.
In third place, the script "example1.js" is executed, and then a pop-up with the text "I'm the example 1" appears. Afterwards, I click on OK button inside the pop-up window.
And finally, the body content should be displayed (he paragraph with the text "Hello World"), but it doesn't in Firefox, but in Chrome. In Firefox, the page load doesn't stop.
If I open Firebug in Firefox after last script was executed, I realize that the browser does not receive the body element.
I don't know if my code is correct or is a bug from Firefox.
Thank you.
This is an already reported bug in firefox: https://bugzilla.mozilla.org/show_bug.cgi?id=692754
<html>
<head>
<script type="text/javascript">
function show_confirm(){
var r=confirm("Hello or Goodbye?");
if (r==true){
alert("Hello");
window.location.replace("http://www.google.com/");
} else {
alert("Goodbye");
}
}
</script>
</head>
<body>
<input type="button" onclick="show_confirm()" value="Show a confirm box" />
</body>
</html>
I'm learning JavaScript, and I'm using W3School's Tryit Editor, and this code wasn't working like I hoped. I want it to redirect me to google after someone hits 'OK' twice, but it doesn't seem to work. Can someone help me out?
The problem is that the Try-It Editor is using an IFrame. When I try it in Chrome and open up my developer console, I get the following error:
Refused to display document because display forbidden by X-Frame-Options.
This is because what your code is trying to do is change the location of the current frame, not the entire page.
You can do one of three things:
Try your HTML outside of an IFrame and you should get it to work then.
Try using window.top.location.replace("http://www.google.com/"); instead of window.location
If you must change the location of an iframe with JavaScript, you'll have to either do so outside of the frame or make sure it stays within the same domain as the parent document. (You'll notice that window.location.replace("http://www.w3schools.com") works just fine.)