Cannot Find Body Node Of The DOM To Assign Event-handlers
Jun 9, 2011
What I am coding now is a piece of a much larger project that I am, for the moment, developing on my own. This code, relatively useless on its own, is essentially practice or proof -of-concept. Much of it will probably be used in the larger project. If at times, it seems that I am using a cannon to kill a fly, this is why.
Additionally, I do not claim credit for all the code here. Some of it is copied from other sources. I have studied it, understood it , then modified it appropriately, making it my own.
However, the code is broken. I have tested it on Internet Explorer 9.0.??? and Firefox 4.0.1. It breaks in both browsers. I have previously tested it in Chrome, but not recently. On IE I have used the built in debugger, and I have been using Firebug in Firefox. I have also used the debugger at [URL] quite frequently. JSLINT returns some 'Bad Type' errors regarding 12 lines in the html body, each having the structure: <td><input /></td>. I can find no explanation for the 'Bad Type' errors. Otherwise, according to JSLINT, the code is fine.
The predecessor to this code worked fine. I had been using inline event handlers (onblur and oninput) that called the doMath function when one enters data into the table. The values are then averaged and summed. All this is extremely basic. The problem began when I removed the inline event handlers and began to use window.onload (I believe I am using document.onload now, but the problem has not changed.)
I have adopted Douglas Crockford's 'walkTheDom' recursive function to find all tags with a particular class name. I would like to assign every element in the array returned by this function an event handler.
This is the problem: This script simply cannot find the body node of the DOM ( and, seemingly, none of its child nodes either). Initially I tried 'document.body', which failed. I then began with 'this' (essentially 'document') and tried walking the DOM to get to it ('body') eventually. This, too, failed. I tried array index notation to refer to it(I forget the specific syntax), and most recently, I've given it ('body') an id and referred to it directly using 'document.getElementById()'. These most recent attempts also failed.
After hours of figuratively bashing my head against the wall looking at code and probably even more time doing research online, I am extremely frustrated. As often seems to be the case, my problem is probably simple
I have included most of the code, even though it is a little long. This way you may easily copy the code and reproduce the problem yourself. I do not often post to forums, and, more relevant, I have no idea where the error may be located.
Potential problem areas are in RED.
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
[Code].....
View 2 Replies
ADVERTISEMENT
Jul 23, 2005
I have written a script that gets trigered by IE's toolbar button. In
this script I would like to asign an event handler to an element of the
document currently open in IE. The way one access the document object
from a toolbar button script is:
var doc = external.menuArguments.document;
Now assuming the document has an element called TextArea1, the logical
thing to do would be:
parentwin.document.all('TextArea1').onkeypress = new
Function('window.alert('asdf');');
Which goes compiles and runs, except the event handler does not get
triggered.
Another trick i tried is as follows:
var s = parentwin.document.createElement('script');
s.text = 'window.alert('asdf')'
s.htmlFor = 'TextArea1'
s.event = 'onclick'
parentwin.document.scripts[0] = s;
Same result.
View 1 Replies
View Related
May 27, 2009
<div>
Is it possible find a node backwards instead of forwards.
I would like to do (remember find_reverse does not exist)
View 7 Replies
View Related
Jul 13, 2007
Suppose I have <div id="outter"element. In side the div, I have
other <divand <imgelements. I used the following code
insideElementsList = outterDiv.childNodes;
for (var i = 0; i < list.length; i ++){
insideElementList[i] ...
}
In the loop, how can I know the current element is a <divor a <img>?
View 1 Replies
View Related
Feb 24, 2010
I am writing a programmatically control the focus (basically what I want is to transform "tab" to "enter")... why do I want such a non standard thing? Customer request... and since he is paying, I have to implement it.
Now, currently I solved the problem by finding the next element with a greater "tabIndex" value, but that forces me to configure tabIndex values for everything in my form... and that is specially problematic because some of my UIs are generated dynamically with information in the database...
So, what I want, is to find the next ":input" element traversing the DOM tree in the same way the focus moves when pressing the "tab" key... that should be something like "find the next sibling that is ":input"... if none found, go to parent node, got to sibling of parent node, look in there... if none found, and this parent has no next sibling, go to the parent of the parent and repeat operation recursively..
is there (somewhere) a jQuery plugin (or method) that already does this? Or do I need to write it?
View 3 Replies
View Related
Dec 30, 2010
How To Find The Parent Node of any item in JSON Data
View 1 Replies
View Related
Mar 9, 2011
I have an XML feed which has duplicate media:thumbnail child nodes for item
<item
>
<title
>Taylor's trial 'neo-colonialist'</title
>
[Code]....
View 1 Replies
View Related
Jul 23, 2005
Sorry for the re-post but the original message subject no longer
applies. If I try this in IE5, it doesn't work:
<script type="text/javascript">
window.onload = foo;
</script>
<body>
whereas this does work:
<body onload="javascript:foo();">
This is not the way I want to handle events. I checked MSDN and it seems
to indicate that the first way should work. Is there something I can do
to get the first way (event handlers?) to work in IE5?
View 4 Replies
View Related
Jul 20, 2005
Can I use CSS to set onmouseover ?
In HTML I have a bunch of <A HREF="whatever"
onmouseover=eventhandler(this)">stuff</A>. I would prefer not to have the
onmouseover 'pollution'
Is it possible to specify the eventhandler using css ? i.e.
<A HREF="whatever" class="foo">stuff</A>.
View 3 Replies
View Related
Nov 1, 2011
i'm trying check the value for a node that is loaded with ajax, and to check it every certain time (3 seconds). I've come this far, but don't know where to go from here:
//Messenger frame...
<iframe src="http://settings.messenger.live.com/Conversation/IMMe.aspx?invitee=<?php echo $IsUserAvailable; ?>@apps.messenger.live.com&mkt=es-UY&useTheme=true&themeName=blue&foreColor=333333&backColor=E8F1F8&linkColor=333333&borderColor=AFD3EB&buttonForeColor=333333&buttonBackColor=EEF7FE&
[Code]....
I also read of a method called on(); but never know how to use it, because i can't think of the event i should attach to...
View 2 Replies
View Related
Dec 10, 2011
How to handle error in .find() if nothing found in XML nodes
What I mean is: I request for XML file :
$.ajax({
type:"GET",
url:"myXmlFileOnServer.xml",
dataType: "xml",
[Code].....
so nothing happens at all (after request is done (NO problem with request) - 200 OK )
View 2 Replies
View Related
Sep 10, 2009
I've got a semantic XML document, for which I'm using $.get successfully to extract <title> and description> nodes. The <link> node does not work, however. It returns blank. Strange, since I can see in Firebug that $(this) has 4 children, and link is in there.
[Code]...
View 3 Replies
View Related
Jul 23, 2005
I have a script in which a function launched by a START button
continuously calculates and writes a value to a text box. The
calculation is done in a for loop. In the loop is a conditional that is
a global variable, a boolean. If the boolean is true, break ends the
loop (or is supposed to!). A STOP button has an onclick function that
sets the global variable to true.
What happens, though, is that the function for the STOP button is
not executed until the for loop reaches the maximum value set for i.
Anyone know how you can get one button to stop a process started by
another?
View 4 Replies
View Related
Apr 18, 2006
Is it necessary to return a value from the event handlers? For
instance, what does the return value in the following code signify?
What will be its impact if it returned otherwise (true)?
<a href="http://www.w3schools.com"
onmouseover="alert('An onMouseOver event'); return true">
<img src="Click.gif" width="100" height="30">
</a>
View 9 Replies
View Related
Jun 1, 2006
Here is a little sample code:
<html>
<head>
<script type="text/javascript">
function BodyClick() {
// How to access the event object here?
alert(window.event.shiftKey);
}
function WindowLoad() {
document.body.onclick = BodyClick;
}
window.onload = WindowLoad;
</script>
</head>
<body></body>
</html>
It does not work in FireFox. How to make it work?
My only requirement is that I need to assign the BodyClick() handler
dynamically in script (not statically in HTML). So I cannot use this solution:
<body onclick="BodyClick(event)">
View 1 Replies
View Related
Feb 9, 2011
I've been teaching myself javascript and I'm a bit confused about the whole events business. I've been reading the Sitepoint book (among a bunch of others) and when it gets to Ch 4 things get down right confusing. They claim that inline event handlers are "so 1998", something I've heard before and then they proceed to write some pretty complex library files to get around the fact that IE <= 7 doesn't support much of the alternative ways of handling events--a familiar enough story. Anyhow, it seems that many many tutorials all over the internet (and countless pages) resort to inline event handlers as the standard. So, I'm confused. I obviously need to know inline event handlers if I intend to work as a web developer even though it's so 1998. Obviously inline even handlers are not quite on par with inline font attributes and transparent gif files despite the language one often hears. Can someone set me straight, and if possible suggest a brilliant tutorial, book chapter, or website that lays everything crystal clear for me?
View 14 Replies
View Related
Dec 2, 2005
I wanted to add a onclick event handler to an image in a loop cos I have a dynamic number of images. The problem is I also need to pass a parameter. This works in Opera 8, but doesn't work in IE:
document.images[i].onclick = "javscript: ShowDesc(" + i + ");";
What am I missing?
View 13 Replies
View Related
Jul 15, 2006
I've been reading this page on accessing event handlers and avoiding the inline ones. Suppose I want to hover over a link and make it display something else, I thought this is what I would put in the <head>:
<script type="text/javascript">
var x = document.getElementById('question');
x.onmouseover = function() {document.getElementById('answer').style.display='inline'}
x.onmouseout = function() {document.getElementById('answer').style.display='none'}
</script>
The HTML being:
<a id="question" href="#">Question</a>
<span id="answer" style="display:none;">The answer is 42</span>
I've reread the article in the link but to no avail, I don't know what is wrong.
View 4 Replies
View Related
Jul 23, 2005
Does Event handlers work in netscape.
<HTML><SCRIPT LANGUAGE="JScript">
function mouseclick() {
alert("I was clicked on " + window.event.srcElement.tagName);
}
</SCRIPT>
<BODY
<H1>Welcome!</H1>
<P>This is a very <B>short</B> document.
</BODY>
</HTML>
The above script works fine in IE But not in Netscape 7.2 :((
View 9 Replies
View Related
Aug 9, 2005
I want to build a table that knows where it has been clicked. I found the
following solution myself. Are there better ones?
http://www.student.oulu.fi/~pkarjala/question1.html
(tested on Mozilla 1.7.8/Linux)
It sets the event handlers for each TD in the build() loop, including a
parameter in the function call that is different for each TD.
The whole thing is a simple example with a table with 5 by 5 cells. If you
click on a cell it's supposed to change color. Naturally, my question is
one more general terms. How to make big tables that associate various
event handlers with various cells, and where you will know exactly which
element triggered the event? How to make it simple and maintainable?
View 4 Replies
View Related
Sep 11, 2007
I am writing a javascript code that parses dom and finds event
handlers attached to mouseover events. Then i will replace the
existing handler say B() with my own function say A(). When the event
happen and control comes to my function A(), after doing required
processing i will call B() as shown below
<a href = "abc.com" mouseover = "B();"link </a>
while parsing i will have (trimmed down version)
var oldHandler = node.onmouseover;
node.
function A()
{
/ * my code */
oldHandler.call(this);
}
This was working fine as long as B() was a global function. I started
getting problems when B was a member function. For eg:
function Alerter(text)
{
this.text=text;
var me=this;
this.invoke=function ()
{
alert(this.text);
}
}
var sayHi = new Alerter('Hello, world!');
The web developer would have code like
<a href = "abc.com" mouseover = "sayHi.invoke()"link </a>
But this time around, my function A() fails since although i have
handler to sayHi.invoke(), it has to be executed in correct context.
Other wise "this.text" is giving me error because when i say
oldHandler.call(this), i am executing the sayHi.invoke() with the html
element being passed as this.
View 2 Replies
View Related
Jan 22, 2011
I want to create a HTML Table and correspondingly have 2 buttons. One would be add button and other would be remove button. I have few text boxes where I will fill the data and later on clicking Add these text boxes details would be added to the Table. I am using javascript code to handle the event (on click event handler) Similarly I wanted to delete an entry from the table. This is where I am having a problem. The requirement is: In the table if I click on any row I want that row to be highlighted. I can use any color to highlight the row. Then on clicking Remove Button I want to delete that row that is highlighted. I am unable to solve this as I dont know what event handler to use to perform this action and also how to code for this. I am not sure about the events the HTML table can handle and how the selected row can be deleted.
View 1 Replies
View Related
May 27, 2009
When I register an event handler directly into the HTML tag everything works fine, but I'm trying to register them from the external JS file where the function is, and that doesn't work at all. I've read that this is called the "traditional method" and that it should work.
I've tried it a million different ways, but what I'm putting below AFAIK is correct... but it just doesn't work. I've tried it in Firefox, IE, and Chrome - and used the "Inspect element" feature in Chrome, and am not getting any error messages.
Here is just a simple example of what I'm trying to do - its extremely basic, I know, but I just can't figure out why it won't work.
HTML:
JS:
(Again, it works perfectly when I stick the onclick="message()" event handler directly into the HTML h1 tag, but not when in the external file.)
View 4 Replies
View Related
Jun 2, 2010
I am trying to add onclick event handler to many objects but I can't understand why it doesn't work. To assign event handler I use traditional approach as described in [URL]Heres the code (extract.js):
Code JavaScript:
//the class
function extract(){
[code]....
I know that both select tags don't have options, but I generate them with JS because they hold sequential numbers and this part has no impact on the problem at hand.Both functions help select next or previous index in a given select tag for greater comfort
View 5 Replies
View Related
Mar 7, 2011
I'm trying to figure out a way to put this in all js code with the onclick event handlers and the parameters. I have 3 links that switch the style of my page. Right now I have them working with inline event handlers. Here are my code snippets below.
HTML:
<head>
<link rel="stylesheet" href="style1.css" type="text/css" title="style1"/>
{code}....
View 1 Replies
View Related
Aug 2, 2010
I'm trying to create links that onclick sort a table by title, author, etc. How would I pass an argument to an event handler? Right now, it just executes the sort function. It doesn't wait for me to click the link.
[Code]...
View 2 Replies
View Related
