|
JavaScript - Adding Window Event Listener In Loop
hello,
I am trying to add a window event listener on some links in a loop instead of doing them one by one. I've tried Code: function setListeners (){
for (var i = 0; i < document.links.length; i++) {
src=document.links[i].href;
document.links[i].onmousemove=changeIframeSrc(src, 'solid',1, event);
document.links[i].onmouseout=changeIframeSrc(null,'none',0,event);
}
}
and Code: function setListeners (){
for (var i = 0; i < document.links.length; i++) {
src=document.links[i].href;
document.links[i].onmousemove=function(a1,a2,a3,a4){
return function(){changeIframeSrc(a1,a2,a3,a4);}
}(src, 'solid',1, event);
}
}
but the event keeps coming up undefined. Any ideas on how to do this? Similar TutorialsHello; I am testing some code that finds and element and attempts to add an event handler attribute to it as 'onclick' (test case in Firefox 3.5.9) /* The actual code is: window.onload = function() { //<irrelevant code> var test = document.getElementById('tstEl'); test.setAttributeNode('onclick'); test.setAttribute('onclick', "alert(\"Don\'t get testy\")"); } */ The error per the js console in Firefox is: Error: uncaught exception: [Exception... "Could not convert JavaScript argument arg 0 [nsIDOMHTMLInputElement.setAttributeNode]" nsresult: "0x80570009 (NS_ERROR_XPC_BAD_CONVERT_JS)" location: "JS frame :: http://192.168.1.6/<pathInfo>/SC_branch2_dev.php :: anonymous :: line 35" data: no] I am trying to do this because Element.addEventListener or Element.attachEvent won't allow for arguments to be passed to the event handler code/function. What is going on here? The only line referenced, line35, in the document text containing javascript code is irrelevant to the problem. Thank you for time, interest and attention; WhoEverIReallyAm Dammit, for some reason this script has stopped working :/ When I click the links with the ID's of "login_dialog" and "register_dialog" a div should be shown... I'm using an event listener to do this. Code: function listener_items() {
//Text field background
addEvent(document.getElementById('input_username'), "click", add_username_password);
addEvent(document.getElementById('input_username'), "blur", remove_username_password);
addEvent(document.getElementById('input_password'), "click", add_username_password);
addEvent(document.getElementById('input_password'), "blur", remove_username_password);
//Switch between forms
addEvent(document.getElementById('dialog_login'), "click", login_dialog_login);
addEvent(document.getElementById('dialog_register'), "click", login_dialog_register);
addEvent(document.getElementById('dialog_recovery'), "click", login_dialog_recovery);
//Display Dialog
addEvent(document.getElementById('login_dialog'), "click", navbar_login);
addEvent(document.getElementById('register_dialog'), "click", navbar_register);
//Close Dialog
addEvent(document.getElementById('close_dialog'), "click", login_dialog_close);
}
//Login dialog, login form input fields background text
var add_username_password = function() { add_input_text(this); };
var remove_username_password = function() { remove_input_text(this); };
//Login dialog buttons
var login_dialog_login = function() { display_form('login'); };
var login_dialog_register = function() { display_form('register'); };
var login_dialog_recovery = function() { display_form('recovery'); };
//Close dialog
var login_dialog_close = function() { display_dialog('login', 'hidden'); };
//Navigation bar buttons
var navbar_login = function() { display_dialog('login', 'visible'); };
var navbar_register = function() { display_dialog('register', 'visible'); };
//This function attaches events to elements.
var addEvent = function( elm, evt, fun ) {
if ( elm.addEventListener ) {
elm.addEventListener( evt, fun, false );
} else if ( elm.attachEvent ) {
elm.attachEvent( 'on' + evt, fun );
} else {
elm [ 'on' + evt ] = fun;
}
};
addEvent ( window, "load", listener_items );
//Display/Hide login dialog
function display_dialog(dialog, fun) {
//Define the active menu item style
var active_style = "border-right-width:3px; width:113px; border-right-color:#33CCFF; color:#FFFFFF;";
//Creat array with all forms
var formsHide = Array("login","register","recovery"); var i = 0;
document.getElementById('wrapper').setAttribute('style', 'visibility:' + fun);
for ( i = 0; i < formsHide.length; i++ ) {
if ( formsHide[i] == dialog && fun == 'visible' );
document.getElementById("dialog_" + dialog).setAttribute('style', active_style);
document.getElementById(formsHide[i] + "_form").setAttribute('style', 'visibility:visible');
formsHide.splice(i, 1);
}
document.getElementById(formsHide[i] + "_form").setAttribute('style', 'visibility:hidden');
}
}
//Put text in fields if there is not data, also switch text field to password field
//when focused on. Switch back to text field if no text is entered.
function add_input_text(obj) {
var id = obj.id.split("input_");
document.getElementById(id[1]).innerHTML = '';
}
function remove_input_text(obj) {
if (obj.value.length == 0) {
var id = obj.id.split("input_");
var id2 = id[1].substr(0, 1).toUpperCase() + id[1].substr(1);
document.getElementById(id[1]).innerHTML = id2;
}
}
function display_form(form) {
//Define the active menu item style
var active_style = "border-right-width:3px; width:113px; border-right-color:#33CCFF; color:#FFFFFF;";
var forms = Array("login", "register", "recovery");
for ( c = 0; c < forms.length; c++ ) {
if ( forms[c] == form ) {
document.getElementById( forms[c] + "_form" ).style.visibility = "visible";
document.getElementById("dialog_" + forms[c]).setAttribute('style', active_style);
document.getElementById("dialog_" + forms[c]).setAttribute('class', 'overlay_table' + ' ' + forms[c] + ' active');
forms.splice(c, 1);
}
}
for ( c = 0; c < forms.length; c++ ) {
document.getElementById("dialog_" + forms[c]).setAttribute('style', '')
document.getElementById( forms[c] + "_form" ).style.visibility = "hidden";
document.getElementById("dialog_" + forms[c]).setAttribute('class', 'overlay_table' + ' ' + forms[c]);
}
}
HTML: Code: <span><a href="#" id="login_dialog" style="color:#33CCFF;">Login</a></span> <span><a href="#" id="register_dialog" >Register</a></span> Please can someone explain to me in simple terms which this actually does. From what I understand it will check all events until a defined event happens, such as rollover of a certain image, and then it activates a function? What I want to do is use this so that when I rollover a element such as below: Code: <img src="img url" alt="this is a tooltip" tooltip="true" /> I want it to pass the obj to a function which then runs, and then once the mouse of not over that element it will activate another function passing the previous object to this function. Although an element such as the example below would not activate these functions: Code: <img src="img url" alt="this is a tooltip"/> As the tooltip tag does not exist or has the value of false... Also, wouldn't this use a lot of resources as it checks every event which the mouse passes over? I can't seem to get the event listener to run an event when I focus on the text field with the ID username. JavaScript: Code: function listener_loginForm() {
var fields = Array("username","password");
for ( j = 0; j < fields.length; j++ ) {
var objs = document.getElementById(fields[j]);
for ( var i = 0; i < objs.length; ++i ) {
var elm = objs [ i ];
elm.onblur = function() { display_text_bg(this); };
if (elm.Id = "password") {
elm.onfocus = function() { switch_field(this); };
}
}
}
}
//This function attaches events to elements.
var addEvent = function( elm, evt, fun ) {
if ( elm.addEventListener ) {
elm.addEventListener( evt, fun, false );
} else if ( elm.attachEvent ) {
elm.attachEvent( 'on' + evt, fun );
} else {
elm [ 'on' + evt ] = fun;
}
};
addEvent ( window, "load", listener_loginForm );
//Put text in fields if there is not data, also switch text field to password field
//when focused on. Switch back to text field if no text is entered.
function display_text_bg(obj) {
alert("remove text");
}
function switch_field(obj) {
alert("switch");
}
HTML: Code: <form name="login" class="login">
<label for="username">Username: </label><br />
<input type="text" name="username" id="username" />
<br /><br />
<label for="password">Password: </label><br />
<input type="text" name="password" id="password" />
<br /><br />
<label for="remember">Remember Me? </label><br />
<br />
<span class="remember">
<span class="text">Never</span>
<input type="hidden" value="never" name="rememberme" />
<ul>
<li>Never</li>
<li>24 Hours</li>
<li>1 Week</li>
<li>Always</li>
</ul>
</span>
</form>
here the deal ,,I've solved all but this problem in my script i have my page setup with 1 iframe and the main html the code below is exactly how the page will show up in the iframe, you can copy and paste the whole thing and save it as a htm file to view if needed.. I need a way to catch the clicks that happen within the iframe but from the main section of the page..heres why! this is inserted at the top of the page if(top.location==self.location){top.location="RefESI_search.asp";} just above top.document.reset.RefCat.value= I can get the page to load even with this in the iframes ..but for the purposes of this i left it out so the page would load ok for anyone thats gonna try and help . theres only 2 links in the code.. hopefully whatever will hopefully solve this problem will be able to tell which links were clicked,and i can can point them to the apropriate links. I've looked thru alot of the threads so i know there are some extremely brite ppl in here that can knock this problem out of the ball park very easily.. you can grab the styles sheet from here https://www.docs.sony.com/reflib/Style_esi.css Code: <html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Ref_Lib_Results</title>
<link rel="stylesheet" type="text/css" href="home.css"/>
<script language="javascript">
top.document.reset.RefCat.value="Home Receiver";
top.document.reset.NarrowRef.value="Good";
top.document.reset.criteria.value="stra";
top.document.reset.searchscope.value="model";
top.document.reset.companyscope.value="SONY";
top.document.reset.company.value="SONY";
if(""==""){top.reset();}
function popUp(URL,Name) {
var day = new Date();
var id = "page" + Name;
window.open(URL, id, "toolbar=1,scrollbars=1,location=0,statusbar=1,menubar=0,resizable=1,width=600,height=600");
}
function launchjsmanuals(flag, x, y, z, id) {
//var myTypeLib = new ActiveXObject("Scriptlet.Typelib");
//var GUID = new String(myTypeLib.guid).substr(1,8);
//var endguid = new String(myTypeLib.GUID).substr(25,10);
if((x.indexOf("CHM")!=-1) || (x.indexOf("chm")!=-1)){
alert("You will be prompted to download a file\n\nClick Open - Do NOT click Save");
}
var whnd = "page" + id; //+ GUID + endguid;
var URL = '_manualusage.asp?flag='+flag+'&manual=' + x + '&user=' + y + z + '&manualid=' + id;
if(flag!=""){
whnd = window.open(URL,whnd, "toolbar=0,scrollbars=1,location=0,statusbar=0,menubar=0,resizable=1,width=560,height=600");
}else{
whnd = window.open(URL,"Loader", "toolbar=0,scrollbars=1,location=0,statusbar=0,menubar=0,resizable=1,width=560,height=600");
}
}
function emailit(id, url,name,type,filesize,model,email,custname,cs3event,user){
var namestring = name;
var re = new RegExp('&','gi');
namestring = namestring.replace(re,'and');
name = namestring;
var xurl = "/srvs/common/email.asp?id="+id+"&emailurl="+url+"&title=" + name + "&type="+type+"&model=" + model + "&filesize=" + filesize + "&email=" + email + "&custname=" + custname + "&convid=" +cs3event + "&user=" + user;
popUp(xurl,id);
}
function NarrowSearch(what,value,cat){
switch(what){
case "Category":
parent.document.SearchForm.RefCat.value=value;
parent.document.SearchForm.NarrowRef.value="Good";
parent.document.SearchForm.submit()
break;
case "Model":
if("Home Receiver"!=""){
parent.document.SearchForm.RefCat.value="Home Receiver";
}
parent.document.SearchForm.criteria.value=value;
parent.document.SearchForm.searchscope.value="model";
parent.document.SearchForm.NarrowRef.value="Good";
parent.document.SearchForm.submit()
break;
case "ONLY":
parent.document.SearchForm.criteria.value=value;
parent.document.SearchForm.searchscope.value="model";
parent.document.SearchForm.RefCat.value=cat;
parent.document.SearchForm.NarrowRef.value="Only";
parent.document.SearchForm.submit()
break;
case "ALL":
parent.document.SearchForm.criteria.value=value;
parent.document.SearchForm.RefCat.value=cat;
parent.document.SearchForm.NarrowRef.value="ALL";
parent.document.SearchForm.submit()
break;
}
}
</script>
</head>
<body>
<div id="results">
<div style="height: 400px;border-bottom:1px solid black;"
class="modelblock">
<div style="margin-left:20px; margin-right:15px; margin-top:10px; font-size:10pt">
<span style="float:Right;margin-top:10px;text-align:right">
<table border=0 cellpadding=0 cellspacing=0><tr><td>
<div style="background:silver;color:black;font-size:10px;padding:2px;border:1px solid gray;cursor:pointer" onclick="javascript:NarrowSearch('ALL','stra','Home Receiver')">Display All Models</div>
</td><td> </td><td><div style="width:40px;background:silver;color:black;font-size:10px;padding:2px;border:1px solid gray;cursor:pointer;text-align:center" onclick="javascript:history.go(-1)">Back</div></td></tr></table></span><b>Your search of "<font color=green>stra</font>" matches 66 Models in the Home Receiver category.</b><br><br>Please select the specific model to continue:<table border=0 cellpadding=0 cellspacing=2><tr><td><a class="modellink" onMouseOver="this.className='modellinkhover'" onMouseOut="this.className='modellink'" onclick="javascript:NarrowSearch('ONLY','STRAV1000','Home Receiver')"><b>STRA</b>V1000</a></td><td width=15px></td><td><a class="modellink" onMouseOver="this.className='modellinkhover'" onMouseOut="this.className='modellink'" onclick="javascript:NarrowSearch('ONLY','STRAV1010','Home Receiver')"><b>STRA</b>V1010</a></td><td width=15px></td></tr></table</div></div></div>
<iframe name="Loader" id="Loader" src="blank.htm" style="display:none;height:150px;width:100%;border:1px solid silver"></iframe>
<a onclick="document.getElementById('Loader').style.display='';">*</a>
<script language="javascript">
//alert(parent.IQ.location.href);
</script>
</body>
</html>
Hi Everyone, How would i add an avent listener to change the source of an image? I have added the image to a canvas element through javascript using the code below. Code: var start = new Image(); start.src = "start.jpg"; ctx.drawImage(start, 50, 50); Thanks! I'm trying to simulate a textfield on a canvas; that is when clicking on the text box a cursor appears and blink. My problem here is when I create more than one object, the event listener will work only on the last object created. Here is my code: Javascript Code: var canvas;
var ctx;
var MousePosX;
var MousePosY;
var Cursor_Width = 1;
var Cursor_Height = 21;
var Height = 27;
var LapseTime = 800;
function init(CanvasName) {
canvas = document.getElementById(CanvasName);
ctx = canvas.getContext("2d");
}
/*
Create Textfiled
*/
function Textfield(x, y, w) {
Textfield.prototype.x = x;
Textfield.prototype.y = y;
Textfield.prototype.w = w;
Textfield.prototype.Cursor_PosX = x + 3;
Textfield.prototype.Cursor_PosY = y + 3;
// draw rectangle
ctx.beginPath();
ctx.rect(this.x, this.y, this.w, Height);
ctx.closePath();
ctx.stroke();
// listen for mouse click event
canvas.addEventListener("mousedown", function(evt) {
// calculate mouse coordination on canvas
MousePosX = evt.clientX - canvas.offsetLeft;
MousePosY = evt.clientY - canvas.offsetTop;
// if mouse coordination is within texfield display cursor
if((MousePosX > Textfield.prototype.x && MousePosX < (Textfield.prototype.x + Textfield.prototype.w)) && (MousePosY > Textfield.prototype.y && MousePosY < (Textfield.prototype.y + Height))) {
Textfield.prototype.cursor();
}
});
}
/*
Cursor for textfield
*/
Textfield.prototype.cursor = function() {
// alert("good");
ctx.beginPath();
ctx.strokeStyle = "black";
ctx.rect(this.Cursor_PosX, this.Cursor_PosY, Cursor_Width, Cursor_Height);
ctx.closePath();
ctx.stroke();
setTimeout("Textfield.prototype.animate_cursor()", LapseTime);
};
/*
Change color of cursor to white to make blinking effect
*/
Textfield.prototype.animate_cursor = function() {
ctx.strokeStyle = "white";
ctx.stroke();
setTimeout("Textfield.prototype.cursor()", LapseTime);
};
HTML Code: <!DOCTYPE HTML>
<html>
<head>
<style>
#MyCanvas {
border: 1px solid #000000;
}
</style>
<script src="widgets1.js"></script>
<script>
window.onload = function () {
init('MyCanvas');
var tf1 = new Textfield(10.5, 10.5, 150);
var tf2 = new Textfield(10.5, 50.5, 150);
};
</script>
</head>
<body>
<br /><br /><br />
<center>
<canvas id="MyCanvas" width="700" height="500">
</canvas>
</center>
</body>
</html>
What i want to achieve here is have my event listener on any textfield created on the canvas. Hello! I'm working with nested functions and trying to pass a 'this' value to an anonymous being used in an assignment for an event listener. Here's the basics of my code: Code: <div id='abc'></div>
<script type='text/javascript'>
var abc = function () {
this.myFunction = function() {
var myObj
myObj = document.createElement("input");
myObj.setAttribute("type", "button");
myObj.setAttribute("value", "Click Me");
myObj.addEventListener("click", function () {
this.doDing();
}, false);
document.getElementById('abc').appendChild(myObj);
}
this.doDing = function () { alert('ding'); }
}
var myInstance = new abc();
myInstance.myFunction();
</script>
So, this should plop a button inside our DIV and when clicked I'd like it to run the alert-ding; unfortunately it seems to want to run the function as defined under the buttons object which doesn't work out too well. Any suggestions? Thanks! Hello all, and thank you for your coments, I want to preserve a 16/9 aspect ratio to the window after any resize, making the width a function of the height. As I have a window.resizeTo() inside the window.onresize event function, the infinite loop is served. How may I quit it? Code: <html><head><title>Title</title><script languaje="javascript">
const c_ra=16/9;
window.onresize = function WindowReSize() {
var myWidth = 0, myHeight = 0;
if( typeof( window.innerWidth ) == 'number' ) {
//Non-IE
// myWidth = window.innerWidth;
myHeight = window.innerHeight;
} else if( document.documentElement && ( document.documentElement.clientWidth || document.documentElement.clientHeight ) ) {
//IE 6+ in 'standards compliant mode'
// myWidth = document.documentElement.clientWidth;
myHeight = document.documentElement.clientHeight;
}
myWidth = Math.floor(myHeight*c_ra);
window.resizeTo(myWidth,myHeight); // ** CAUTION resize event in a onresize event handler !
};
</script></head><body><p>Hello World</p></body></html>
I have cpa gateway on a site that when the customer completes a function of the gateway. The external js of the gateway sends a command to the website to reload the site. Is there any way I can have some sort of event listener to know if that command is sent or not? The problem I'm having is its causing a loop in my existing JS. So it keeps looping the page. I would like to be able to set a cookie when the command is sent and then just have the cpa gateway not load. Thanks all! I haven't been on here in awhile so I have been learning a lot on my own! But this one stumps me Eric. hi there here's my problem, I want to alert each innerHTML of the tag "a" when mouse over, but it only alert when i insert "return false;" in the end of the loop, what's the problem? Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title></title>
<script type="text/javascript" >
function show(){
var linkIt = document.getElementsByTagName("a")
for(var i=0; i<linkIt.length; i++){
linkIt[i].onmouseover = function(){
alert(linkIt[i].innerHTML);
}
return false;
}
}
</script>
</head>
<body onload="show()">
<ul id="imagegallery">
<li>
<a href="images/fireworks.jpg" title="A fireworks display">Fireworks</a>
</li>
<li>
<a href="images/coffee.jpg" title="A cup of black coffee" >Coffee</a>
</li>
<li>
<a href="images/rose.jpg" title="A red, red rose">Rose</a>
</li>
<li>
<a href="images/bigben.jpg" title="The famous clock">Big Ben</a>
</li>
</ul>
</body>
</html>
Hi all, I can't seem to add an onclick event to an image. I'm sure I am doing something wrong as I am very new to Javascript. This is a part of my javascript code that is in the head and body of my HTML file: Code: <head>
<script language="JavaScript">
.....
.....
var redLocation0 = redArray[0]+".jpg";
....
....
function redClick( buttonLocation ) {
window.location = "http://www.yahoo.com/"
}
....
....
</script>
</head>
<body>
<table>
<tr>
<td>
<script language="javascript">document.write('<IMG SRC="'+ redLocation0 +'">'); onclick="redClick('0')";</script>
</td>
</tr>
</table>
</body>
The image that is displayed is not clickable, and therefore the function redClick cannot be called. Can someone please help me and tell me where I am going wrong here. I am kinda new to JavaScript. Thanks! Hey, im having another problem with my JavaScript. I wanted to call 2 functions inline, but I can't seem to do it. So I have added the function (add_event_listeners) to the function (load_doc) that is usually called. JavaScript debugger is saying: Code: Uncaught TypeError: Cannot read property 'addEventListener' of null JavaScript: PHP Code: //Get httpobject function getHTTPObject() { var http = false; if (window.XMLHttpRequest) { http = new XMLHttpRequest(); } else if (window.ActiveXObject) { http = new ActiveXObject("Microsoft.XMLHTTP"); } return http; } //This function attaches events to elements. var addEvent = function( elm, evt, fun ) { if ( elm.addEventListener ) { elm.addEventListener( evt, fun, false ); } else if ( elm.attachEvent ) { elm.attachEvent( 'on' + evt, fun ); } else { elm [ 'on' + evt ] = fun; } }; function load_doc(doc, parent) { add_event_listeners(); document.getElementById(parent).innerHTML = "Fetching data..."; var http = getHTTPObject(); if (http != undefined) { http.onreadystatechange = function() { req_doc(doc, parent, http); }; http.open("GET", doc, true); http.send(""); } } function req_doc(doc, parent, req) { if (req.readyState == 4) {//only if req is loaded if (req.status == 200) {//And if its okay document.getElementById(parent).innerHTML = req.responseText; } else { document.getElementById(parent).innerHTML = "Error fetching data: " + req.status + "\n" + req.statusText; } } } //Script used to hide elements. Usage: expand(element id) function expand(elm) { var ex = document.getElementById(elm).style.display; if (ex == "none") { var obj = document.getElementById(elm); obj.style.display = "inline"; } else if (ex == "inline") { var obj = document.getElementById(elm); obj.style.display = "none"; } } function add_event_listeners() { addEvent(document.getElementById('username'), "click", check_database); addEvent(document.getElementById('email'), "click", check_database); addEvent(document.getElementById('password_2'), "blur", check_password); } var check_database = function() { check_database_existing(this); }; var check_password = function() { compare_fields(this); }; function check_database_existing(obj) { } function compare_fields(obj) { var field2 = obj.id.split("_"); field2 = document.getElementById(field2[0]).value; if (obj.value == field2) { if (obj.value.length >= 4) { document.getElementById("pass_status").style.color = "#00CC00"; document.getElementById("pass_status").innerHTML = "OK!"; } else { document.getElementById("pass_status").innerHTML = "Please must be between 5 - 14 characters long! "; document.getElementById("pass_status").style.color = "#FF0000"; } } else { document.getElementById("pass_status").innerHTML = "Passwords do not match!"; document.getElementById("pass_status").style.color = "#FF0000"; } } HTML: Code: <div style="border-color:#090; border-width:1px; border-style:solid;">
<div class="login_button register_button" onClick="load_doc('pages/forms/login_form.php', 'login_form')">Back to login</div>
<h1>Register</h1>
<h3>DrawSomething - WordGuesser</h3>
<br />
<form id="register" action="php/register.php" method="post">
Username<br /><h4 id="username_status">(waiting)</h4><br /><input type="text" name="username" id="username" class="text login_field"><br />
Email<br /><h4 id="email_status">(waiting)</h4><br /><input type="email" name="email" id="email" class="text login_field"><br />
--<br />
Password<br /><input type="password" name="password" id="password" class="text login_field"><br />
Retype<br /><h4 id="pass_status">(waiting)</h4><br /><input type="r_password" id="password2" name="password" class="text login_field">
<br />
<input type="submit" value="Register" class="button green" />
</form>
</div>
hi, i have aded window unload event handler to my code. my page calls some function that takes few secs and page then loads in 5-6 secs. while ths page is loading, if user clicks 'x' on browser window, then code inside unload event handler doesnt get executed. if user waits for page to be loaded fully and hten clicks 'x', then unload event handler gets executed. but i want if during loading user decides to click 'x' button, then also unload handler shold get exucted. i am pasting a sample code that simulates my situation: <html xmlns="http://www.w3.org/1999/xhtml" > <head> <title>Untitled Page</title> <script type="text/javascript"> function unloadPage() { alert('unloaded page'); } function pauseJS(timeInMilliS) { var date = new Date(); var curDate = null; do { curDate = new Date(); }while(curDate-date < timeInMilliS); } </script> </head> <body onload="pauseJS(6000)" onunload="unloadPage()"> <p>Test Page</p> </body> </html> I want to capture Window close event. UnLoad will not help me as this event will be called whenever it is redirected to other page. I want as soon as user try to close the window i want to display an confirm message if user Click Ok then browser will be closed and if cancel it will not. Can anybody help me out on this. Dhiru Hi all, I have a HTML and I am opening another link in a separate window using window.open() . The child window is something like 'http://yahoo.com' which is out side html. I need to refresh the parent window when the child window is closed. any idea? Thanks, Mahesh If I use a window opener to open a new window, is there a way to detect that the new window is finished loading before carrying out some other directive in the opener window? Can I access the remote window's onload event from the opener window? I need to know that the website has loaded before moving to the next page. something like: remoteWindow.onload = goToPage(url); Is this even possible? Hello, I'm working on a quote generator and I'm running into an issue with onChange events not firing when a text field is dynamically populated via a child window. Here's my setup: I have 3 text boxes (quantity, price, markup) that are multiplied together in order to give the total of that product. Each text box has an onChange event [called calculator()] that calls an external javascript file, which handles the multiplication and instantly updates the total of that product. Up to this point, everything works fine - - when I manually edit any of the 3 inputs, the total updates correctly. However, my problem is that I now have the "price" text box being dynamically populated, and when it updates it is not firing the onChange event attached to it. The text box is being filled by way of launching a child window and running the following code within it: Code: function call_submit()
{
opener.document.quote_form.item_price_1.value=document.child.prods.options[document.child.prods.selectedIndex].id
self.close();
}
I've also tried to call the calculator function from within the child window, with no luck: Code: function call_submit()
{
opener.document.estimator_form.item_price_1.value=document.child.prods.options[document.child.prods.selectedIndex].id
calculator ()
self.close();
}
So, as of right now, the following is happening - - I launch the child window, I select the product to add to the quote, the child window closes and the price is correctly populates within the "price" text box, BUT the total stays at zero. If I manually edit any of the fields, it then catches back up and properly updates the total. Is their any way to fire the onChange event at the time when the text field is populated from the child window? Any help would be appreciated. Thanks in advance. |
|||||||