JavaScript/DOM: Can't set onclick-attribute for <a>'-tags in IE

Reinhold Schrecker

Hi there,

I am trying to generate a dynamic menu with JavaScript/DOM and have
problems to set the onclick-attribute for my <a>-elements.

The following code works fine in Opera and Mozilla but does not work in
IE:


<script language="JavaScript">

</script>


Regards
Reinhold

May 22 '06 #1

Subscribe Reply

14888

Martin Honnen

Reinhold Schrecker wrote:

I am trying to generate a dynamic menu with JavaScript/DOM and have
problems to set the onclick-attribute for my <a>-elements.

With the HTML DOM don't use the setAttribute method, it works very
differently in IE compared to other browsers, you can simply assign to
element object properties instead e.g.
element.id = 'someId';
element.onclick = someJavaScriptFunction;
or in your case you like want e.g.
element.onclick = new Function ("evt", topArray[j]["a_onclick"]);
--

Martin Honnen
http://JavaScript.FAQTs.com/

May 22 '06 #2

Reinhold Schrecker

>or in your case you like want e.g.

element.onclick = new Function ("evt", topArray[j]["a_onclick"]);

....works fine.

Thanks a lot for your fast support.
Reinhold

May 22 '06 #3

Martin Honnen wrote:

Reinhold Schrecker wrote:

I am trying to generate a dynamic menu with JavaScript/DOM and have
problems to set the onclick-attribute for my <a>-elements.

With the HTML DOM don't use the setAttribute method, it works very
differently in IE compared to other browsers, you can simply assign to
element object properties instead e.g.
element.id = 'someId';
element.onclick = someJavaScriptFunction;
or in your case you like want e.g.
element.onclick = new Function ("evt", topArray[j]["a_onclick"]);

As an addon: not to correct the solution (it doesn't need to) but to
clarify the situation with setAttribute/removeAttribute methods, as it
gives an impression of IE doing ("once again" :-) something wrong.

setAttribute/removeAttribute are methods to operate with the element
nodes (as reflected in the DOM Tree), not with DOM interface (as
provided to the script engine). This they have a rather narrow
application domain: when you need to change the DOM Tree itself (say if
you are preparing it for a tree walker). Respectively setAttribute
takes its argument as a plain vanilla text string and just add it as
nodeValue to the tree. It doesn't and it shouldn't to anyhow parse it,
DOM specs are very clear on it. So the way some browsers do allow you
to assign intrinsic handlers this way (over setAttribute) is little
convenience cheet-chat on specs. I personally welcome it (as any extra
convenience) but officially they shouldn't do it.

In the sample below you can click on "Test" to see that the dynamic
link indeed has attribute "ONCLICK" with value "alert('OK')" - but this
is just an attribute (not a handler) with /text/ value (not JScript
code).

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type"
content="text/html; charset=iso-8859-1">
<script type="text/javascript">
function demo(){
var p = document.createElement('P');
var a = document.createElement('A');
a.innerHTML = '<b>Click me</b>';
a.id = 'a01';
a.href = '#';
p.appendChild(a);
document.body.appendChild(p);
a.setAttribute('onclick', "alert('OK')");
}

window.onload = demo;
</script>
</head>

<body>
<p style="cursor:pointer"
onclick="alert(document.getElementById('a01').getA ttribute('ONCLICK'))">
Test</p>
</body>
</html>

May 22 '06 #4

Similar topics

9247

document.links["id"].href -> Browsersafe?

by: Konrad Mathieu | last post by:

Does this work in most browsers, namely MSIE? document.links.href or does it have to be document.links.href ?

Javascript

1943

REQ: Could Someone assist in correcting this code ::::::::>>>(New JavaScript Student)

by: Sue | last post by:

Hello! I am back with another question. Remember I am a new JavaScript student and I am aware that this code does not check for all the possibilities and that as a "NEW" JavaScript student I am...

Javascript

7145

Can't change bullet image

by: bigoxygen | last post by:

Hi. I have a list that is similar to this: -Evaluation +test +test -Students +test I would like to change the "-" bullet only, but I cannot. My

HTML / CSS

5135

=> Scroll IFrame Content to desired Position (JavaScript)

by: Alexander | last post by:

Scroll IFrame Content to desired Position (JavaScript) ====================================== How can I scoll the content of an Ifram to a desire Position? The function should be:...

Javascript

11426

Overriding an onclick with another onclick

by: tomlong | last post by:

Hi, I have a tabular form that each TR has an onclick event to edit the row. I also have a div in one of the cells on each row that is a delete button. My problem is that both onclicks are being...

Javascript

2396

javascript in a query's text string

by: geotso | last post by:

Here is the scenario: 1. I have a table (tblCalendar) with the following fields: caldID caldDate caldTitle caldInfo nWinW nWinH

Microsoft Access / VBA

3473

Ordered List/ UnOrdered List -> Transform them into drop down menus

by: User | last post by:

Hi, Is it possible to transform Ordered/Unordered list into navigation dropdown menus? Is this effect achieved by CSS? or via Javascript? PLease advise Thanks.

Javascript

5590

DOM Table: how to get the correct row no

by: yangtono | last post by:

Hi, I'm working on a program using javascript to create a dynamic table. Initially was developing this in IE environment. It work fine, but realise that it doesn't work on Mozilla FireFox. So I...

Javascript

4921

Ajax -> javascript edit box display problems - please help

by: Bob | last post by:

Hi, Hope you can help me with this one. I'm at my wits end. I'm trying to create an intelligent edit-box like the excellent "Customer" one at the URL: ...

Javascript

2367

Variables moving javascript ->ajax ->php -> sql

by: quirk | last post by:

I am trying to write a script where a page is populated with some maths questions, user answers them (it's timed but I've left this bit out), gets results on same page and ajax takes their score,...

Javascript

7251

What is ONU?

by: marktang | last post by:

ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However,...

General

7148

Changing the language in Windows 10

by: Hystou | last post by:

Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can...

Windows Server

7367

Problem With Comparison Operator <=> in G++

by: Oralloy | last post by:

Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers,...

C / C++

7430

Maximizing Business Potential: The Nexus of Website Design and Digital Marketing

by: jinu1996 | last post by:

In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven...

Online Marketing

7517

Discussion: How does Zigbee compare with other wireless protocols in smart home applications?

by: tracyyun | last post by:

Dear forum friends, With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each...

General

5673

AI Job Threat for Devs

by: agi2029 | last post by:

Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing,...

Career Advice

5072

Access Europe - Using VBA to create a class based on a table - Wed 1 May

by: isladogs | last post by:

The next Access Europe User Group meeting will be on Wednesday 1 May 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome a new...

Microsoft Access / VBA

1581

transfer the data from one system to another through ip address

by: 6302768590 | last post by:

Hai team i want code for transfer the data from one system to another through IP address by using C# our system has to for every 5mins then we have to update the data what the data is updated ...

C# / C Sharp

451

Comprehensive Guide to Website Development in Toronto: Expert Insights from BSMN Consultancy

by: bsmnconsultancy | last post by:

In today's digital era, a well-designed website is crucial for businesses looking to succeed. Whether you're a small business owner or a large corporation in Toronto, having a strong online presence...

General