Why I Can't Use AttachEvent With InnerHTML;

Apr 27, 2007

if i use AttachEvent like this,it can't work;
eg:

var img = document.createElement("img");
img.attachEvent("onclick",alert("test"));
var div = document.createElement("div");
div.appendChild(img); //can't work;
div.innerHTML="<-click this";

but i use attachEvent like this,it work; eg:

var img = document.createElement("img");
img.attachEvent("onclick",alert("test"));
var text = document.createElement("span");
text.innerHTML="<-click this";
var div = documet.createElement("div");

div.appendChild(img); //can work
div.appendChild(text);

View 6 Replies


ADVERTISEMENT

Any Need For AddEventListener() And AttachEvent() At All?

Nov 16, 2006

Today I have been testing the event models from Netscape 4.8 and IE 4
to the current crop of browsers. I'd like to write a small event
library similar in purpose to the Yahoo! UI event library but with less
features and code. The Yahoo! event library is one of the best
libraries in YUI but it still seems to me to have some confused
code...that or I'm still confused.

The Yahoo! UI library focuses on using addEventListener and
attachEvent. However, due to the click and dblclick bugs in Safari a
long legacy event workaround is included to use a Netscape4-type event
model for Safari. Something like this

var listeners = [function(event){}, function(event){}];
document.getElementById('blue').onmouseover = function(event) {
for (var i=0; i<listeners.length; i++) {
listeners[i](event);
}
};

With this above example, multiple handler functions can be fired for a
single event. I imagine that this is an old trick that has been around
for a long time, yes?

With all the new browsers I tested with this legacy workaround, the
listener handlers can use event.stopPropogation() or
event.cancelBubble=true and they work as desired. The handler functions
can also use event.preventDefault() and event.returnValue=false and
they too work. These seem to work because the event object passed to
the handlers is a modern event object and not one from Netscape4.

My question is, if Safari needs this legacy workaround, and the legacy
workaround seems to work in all the browsers that have addEventListener
or attachEvent, then why bother with the addEventListener and
attachEvent functions at all? Why not just use the legacy way for all
browsers and all type of events.?

View 10 Replies View Related

Dynamic Variables In AttachEvent

Jan 24, 2007

I am trying to write a loop that will add 10 divs to the screen. Each
div will have an onclick event. The function that will be called
onclick requires a parameter. That parameter is dynamic based on the
index of the loop. In Firefox this is no problem. However in IE I get
some results that I wouldn't expect.

Here is my code:

for(var i = 0; i < 10; i++)
{
var linename = jsonObj.lines[i].line;
var childcountid = jsonObj.lines[i].childcount;
var lineid = jsonObj.lines[i].lineid;

var newdiv = document.createElement('div');
newdiv.setAttribute("id","main" + i);
if (navigator.appName == "Microsoft Internet Explorer")
{
//************ this is the problem area
*****************
newspan.attachEvent("onclick", function() {getCategories('main' +
i)});
}
else
{
newspan.setAttribute("onclick", "getCategories('main" + i + "')");
}
document.getElementById('container').appendChild(n ewdiv);
}

What happens is when the element is clicked the parameter being passed
to getCategories is always 'main9' IE always grabs the current value
of i, not the value of i at the stage of the loop that attachEvent was
called.....

View 1 Replies View Related

How To Discover If AttachEvent Was Done To An Element

Aug 28, 2007

I need to check if attachEvent was done to an element. The problem is that attachEvent does not save this information anywhere.

View 12 Replies View Related

Compatibility - AttachEvent Vs AddEventListener Vs Other?

Mar 17, 2003

As I understand it so far:

element.attachEvent()
IE 5+ for PC

element.addEventListener()
Gecko, KHTML

element.event
NS3+, IE4+, dunno about opera or others

Since I'm only concerned with attaching a single event and don't care about bubbling/capturing, am I best off not using the old style of event registering to assure maxium compatibility?

View 2 Replies View Related

Multiple AttachEvent On Document?

Oct 26, 2006

Does anyone know of a way to attach multiple events to the document element?

I have a class that when initiated attaches events to the element it effects but also attaches an event to the document element.

If my class is declared more then once, only one of the classes will be effected by the event (on the document element) where as I need both.

this.addEvent = function(obj, type, fn )
{
if(obj.attachEvent)
{
obj['e'+type+fn] = fn;
obj[type+fn] = function()
{
obj['e'+type+fn]( window.event );
}
obj.attachEvent( 'on'+type, obj[type+fn] );
}
else
obj.addEventListener( type, fn, false );
}

I presume it works fine on Firefox because addEventListening allows multiple assignments where as attachEvent doesn't.

View 4 Replies View Related

AttachEvent - Container (player) Responds As Expected In All Browsers Except Ie

Sep 8, 2010

The event added to the flash object (videoPlayer) or to its container (player) responds as expected in all browsers except ie. I trtied everything I could possibly think of and still can't get it work in ie. The only event that works in ie is "onactivate".

[Code]...

View 1 Replies View Related

Register A Click Event Onto A Input Element With AddEventListener And AttachEvent

Dec 19, 2009

I'm just trying to register a simple click event onto a input element with addEventListener and attachEvent... My code:

[Code]...

View 2 Replies View Related

Window.attachEvent - Get 'Object Doesn't Support This Property Or Method' - In IE8

Oct 4, 2011

I have a cross domain iframe resizing script (using postMessage) that works perfectly in Chrome, FF, Safari and IE9 - browsers that use addEventListener I'm trying to get it to work in IE8 by adding what I thought was the right language for attachEvent, but it's not working in IE8 - I just get 'Object doesn't support this property or method' - again just in IE8.

[Code]...

View 2 Replies View Related

AttachEvent - Send Data Back To The Parent Page To Create New Table Rows

Jan 13, 2009

A page I'm working on lets users open a new window, which in turn lets them send data back to the parent page to create new table rows, cells, links, etc. One of the links created is "delete", so it should delete the row that the delete link belongs to when clicked on. I can do this no problem in ff using the setAttribute('onclick',onClickEvent), but can't do this in IE. I'll show some code to make this easier to understand....

[Code]....

View 3 Replies View Related

AttachEvent - Error "sfHover Isn't Defined"

Apr 11, 2009

why the following code refuses to do anything.

[Code]...

I get the error "sfHover isn't defined". What am I doing wrong? The purpose of the code would be to add a :hover (here: .sfHover) css pseudo-class on the mouseover event, to work in IE.

View 2 Replies View Related

Any Way To Add If And Else Within InnerHTML

Mar 16, 2009

Is there a way to add an if and else with in innerHTML like this.
var sfe = document.getElementById("mainform").innerHTML ='<form name="'+frmName+'">'+
'<!-- comment -->'+
'<h2 id="pa" name="dr">';if(n == 1){'+fname+'}else if(n == 2){<b>No Title</b>} '</h2>'+
'more'+

View 4 Replies View Related

Using DOM Instead Of InnerHTML

Apr 10, 2006

I'm currently using AJAX to perform some dynamic updates and return some text to the web page. At the moment I'm using innerHTML as follows:

document.getElementById('WrkItemDiv').innerHTML=wrkItemReq.responseText;

but I'd like to be standards compliant. How would I do this using pure DOM stuff?

btw WrkItemDiv is an exisiting <div> I simply want to overwrite the text within it with the newly returned text.

Also, is it possible to change the onMouseOVer code with some text returned in the same way as above using pure DOM?

View 12 Replies View Related

InnerHTML

Oct 22, 2007

I am getting data from two tables in a database using a dropdown box with a onchange and some ajax to update two diferent Div tags, basically the id is passed to a php page,, I grab the data from the two tables, I then echo the data in two html tables. I echo a ** for a delimiter between the two tables,

Then I use a javascript split function to split the responseText into two peices so I can update each DIV with the coresponding data.

Everything works in Firefox, but in IE7 only one div gets updated with its data, the other div will not change, and I get a unknown runtime error. However if I go into my php page and change the data I am echoing after the delimiter to a simple echo 'test' it will work. Code:

View 2 Replies View Related

DOM Row/cell With InnerHTML

Jul 23, 2005

I've got this code that creates a new new row and cell. I then put some
text into the cell with innerHTML - works beautifully with Firefox but
fails with IE. I guess IE doesn't support this way of doing it, but is
there another way of doing it with DOM?

newr = document.createElement('tr');

stbl.appendChild(newr);
newc = document.createElement('td');

newr.appendChild(newc);
newr.cells[0].innerHTML = (nr+1)+". "+sa[ti][nr + 1]+"<br><hr>";
(works in firefox but fails in IE 6+ too...)

View 22 Replies View Related

InnerHTML In IE Vs Firefox

Jul 23, 2005

Here is my problem in a nutshell: a script to model dynamic table
extension. It works under Firefox. But IE just aborts, complaining about
an "unknown runtime error" in the line with "innerHTML". Why?

<html><head></head><body>

<script language="javascript">
function extend() {
var tb = document.getElementById('thetable').tBodies[0];
var newrow = document.createElement('tr');
tb.insertBefore(newrow,tb.rows[tb.rows.length-1]);
tb.rows[tb.rows.length-2].innerHTML =
'<td>A</td><td>dummy</td><td>row</td>'
}
</script>

<table id="thetable">
<tr><td>1-1</td><td>1-2</td><td>1-3</td></tr>
<tr><td>2-1</td><td>2-2</td><td>2-3</td></tr>
<tr><td>3-1</td><td>3-2</td><td>3-3</td></tr>
<tr><td colspan="3"><a href="javascript:extend();">extend</a></td></tr>
</table>
</body>
</html>

View 1 Replies View Related

IE Munges InnerHTML

Jul 23, 2005

IE seems to munge the innerHTML of a document, does anyone know why
it's changing the innerHTML?

<body>

<div style="background-color:LightGrey;" onclick="window.alert( 'one:'
+ getElementById('one').innerHTML );" id="one">
<table id="tableone">
<tr id="trone">
<td>click me</td>
</tr>
</table>

</div>

<div id="two" style="background-color:LightBlue;"
onclick="window.alert( 'two:' + getElementById('two').innerHTML );">
<table id="tabletwo">
<tr id="trtwo">
<td>click me too</td>
</tr>
</table>
<input type="checkbox" checked="checked" value="MYVAL" />
</div>
</body>

View 4 Replies View Related

Firefox And InnerHTML

Jul 23, 2005

Why doesn't a SELECT element's innerHTML reflected which option was
selected? Works in IE. I need this functionality so that I can retain
what choices a user made in a tabbed interface.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://w3.org/1999/xhtml">
<head>

<script language="javascript">
function callAlert(){
var theHTML = document.getElementById('Radius').innerHTML;
//alert(theHTML);
}
</script>
<title>Untitled Document</title>
</head>

<body>
<form id="myForm">
<div id="myDiv">
<table border="0" width="430" cellpadding="3" cellspacing="0">
<tr>
<td font color="#ff0000">*</font>Radius:</td>
<td width="331" height="30" class="formData">
<select onChange="callAlert();" id="Radius" name="Radius">
<option value=".10" id="0">1/10 mile</option>
<option value=".20">1/5 mile</option>
<option value=".25">1/4 mile</option>
<option value=".5">1/2 mile</option>
<option value=".75">3/4 mile</option>
<option value="1">1 mile</option>
</select>
</td>
</tr>
</table>
</div>
</form>
</body>
</html>

View 24 Replies View Related

Using Frames And Getting InnerHTML

Mar 8, 2006

I am using a frameset with two frames that looks like this:

|------------------------------|
| |--------------------------| |
| | FRAME 1 | |
| | | |
| | | |
| | | |
| | | |
| | | |
| | | |
| | | |
| | | |
| |--------------------------| |
| |
| |--------------------------| |
| | FRAME 2 | |
| | | |
| | <html><body> | |
| | <table><tbody> | |
| | <tr> | |
| | <td>Data 1</td> | |
| | <td>Data 2</td> | |
| | </tr> | |
| | </tbody></table> | |
| | </body></html> | |
| |--------------------------| |
|------------------------------|

FRAME 2 has no height, so it looks as if you only have 1 frame. I am
using FRAME 2 to retrieve data from my server.

I open up FRAME 1 with my webpage and leave FRAME 2 empty. When the
user request data I target FRAME 2 and the data is loaded into FRAME 2.

What I have been trying to do is this. Take the innerHTML of the FRAME
2's table and load it into a table in FRAME 1.

View 1 Replies View Related

InnerHTML And <script>

Jul 6, 2006

I want to load an external file into my page via XMLhttpRequest and
innerHTML. The external file contains javascript code which is not executed during
or after insertion. All the HTML markup is displayed just fine....
basicly even this code doesnt work:

<div id='tmp'>original Content</div>

<script>
document.getElementById("tmp").innerHTML="<b>new</b>
Content<script>alert('not shown! why?');</script>";
</script>

looking at the page, "new Content" is shown with "new" bold as
expected, but there wont be the javascript alert!

View 1 Replies View Related

InnerHTML And SCRIPT Tag

Jul 19, 2006

I use Ajax to retrieve part of a page I need to update. I update a DIV
element with the HTML contents I get from another page.

It works fine.

However the HTML have a SCRIPT tag that the browser should process, but
it doesn't.

Here's an example:

--- pageX.aspx ---
<table>
<tr>
<td>Table 01</td>
</tr>
</table>
<script>
alert("HI");
</script>
--- end pageX.aspx ---

--- page on browser ---
<div id="divContents"></div>

<script>
divContents.innerHTML = getHtmlFromPage("pageX.aspx");
</script>
--- end page on browser ---

When the prowser gets the "pageX.aspx" and updates the contents of the
'divContents' it displays the table, but it didn't process the script.

What am I doing wrong?

View 17 Replies View Related

A Debugger To Let Me See The InnerHTML Of A Div?

Sep 29, 2006

What debugger would let me see the HTML in a div after I've added HTML
to the div using its innerHTML? That is:

var someInputHtml = prompt("input html");
var referenceToSomeDiv = document.getElementById("someDiv");
referenceToSomeDiv.innerHTML = someInputHtml;

When debugging, how do I now see what HTML is in the div "someDiv"?

Maybe there is a FireFox extension for this? Firebug?

View 5 Replies View Related

Var.innerHTML Where Var Is A Variable!!

Jul 20, 2005

Is there any way to use a variable.innerHTML = ""; instead of text.innerHTML
= "";? It doesn't seem to work for me.

View 2 Replies View Related

Javascript InnerHTML

Jul 20, 2005

How can I get the innerHTML of a <div> area only when the page loads, then use that variable in a function?

Here is my code:
function setContent(zz)
{
var lb = document.getElementById('leftbar').innerHTML;
var rb = document.getElementById('rightbar').innerHTML;
document.getElementById("myContent").innerHTML = "<span class="title_Page">"+Page[zz]+"</span>";
if (zz=="home") {
document.getElementById('leftbar').innerHTML = lb;
document.getElementById('rightbar').innerHTML = rb;
document.getElementById('leftbar').style.width = &#39135;px'
document.getElementById('rightbar').style.width = &#39135;px'
}
else {
document.getElementById('leftbar').innerHTML = "";
document.getElementById('rightbar').innerHTML = "";
document.getElementById('leftbar').style.width = &#390;px'
document.getElementById('rightbar').style.width = &#390;px'
}
}

I want lb and rb to be set only once (i.e. only when the page loads the first time). I tried putting those variables outside the function, but when I do they, they show up as undefined. So how could i code it so that when the page loads, it assigns the innerHTML to the two variables, but not any other time while that page is open?

View -1 Replies View Related

InnerHTML Of Another Frame

Jul 20, 2005

I have a page as follows:

<HTML>
<FRAMESET ROWS="20%, 80%">
<FRAME SRC="editor.html" NAME="editor">
<FRAME SRC="testfile.html" NAME="reader">
</FRAMESET>
</HTML>

editor.html contains the following code:

code = document.documentElement.innerHTML

which gives me the HTML-code of editor.html as expected.
Now I want to read the HTML-code of testfile.html instead. But

code = parent.reader.document.documentElement.innerHTML

just returns

<head></head><body></body>

with Mozilla, and IE gives an error.

Can somebody explain why this happens, and how I can solve it?
Since the first case works on all browsers I tried, I was hoping to get
a browser-independant method to read the sourcecode of another file.
By the way, all files are local.

View 1 Replies View Related

Iframe InnerHTML

Jul 20, 2005

I'm using an i-frame to grab a server-side text file and display its content
elsewhere in the html document. On change of the i-frame source, I want to
access its innerHTML.

The i-frame source changes just fine and even displays the source; the glitch
is in accessing the innerHTML for that new i-frame src file. It requires *TWO*
clicks of the onClick element to get the correct innerHTML (with just one
click, the source will change, and display the new file in the html document;
however, the innerHTML is still that of the old source file for the i-frame).

This does not appear to be a loading problem with the new src file into the
i-frame. (ie: setTimeout on a function to get the innerHTML after the src file
loads does not work).

So the question is: how can I get the i-frame source to change AND access the
new src file's innerHTML with one click?? Code:

View 4 Replies View Related







Copyrights 2005-15 www.BigResource.com, All rights reserved