473,387 Members | 1,535 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,387 software developers and data experts.

What wrong with the 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">
<body>
<div id="navcontainer">
<ul id="navlist">
<li id="active"><a href="#" id="current">Item one</a></li>
<li><a href="#">Item two</a></li>
<li><a href="#">Item three</a></li>
<li><a href="#">Item four</a></li>
<li><a href="#">Item five</a></li>
</ul>
</div>
<script defer="false" type="text/javascript">
function initNavlists(){
var nav = document.getElementById('navlist');
if (nav){
var links = nav.getElementsByTagName('a');
for (var i=0;i<links.length;i++)
{
var str = links[i].innerHTML;
//alert(str);
links[i].onclick = function(){ alert(str); };
}
}
}

initNavlists();
</script>
</body>
</html>

Why i always get the last item in the alert box?
How to get the rest?
Jul 23 '05 #1
3 1659


John Smith wrote:
<div id="navcontainer">
<ul id="navlist">
<li id="active"><a href="#" id="current">Item one</a></li>
<li><a href="#">Item two</a></li>
<li><a href="#">Item three</a></li>
<li><a href="#">Item four</a></li>
<li><a href="#">Item five</a></li>
</ul>
</div>
<script defer="false" type="text/javascript">
function initNavlists(){
var nav = document.getElementById('navlist');
if (nav){
var links = nav.getElementsByTagName('a');
for (var i=0;i<links.length;i++)
{
var str = links[i].innerHTML;
//alert(str);
links[i].onclick = function(){ alert(str); };


How about
links[i].onclick = function (evt) { alert(this.innerHTML); };
--

Martin Honnen
http://JavaScript.FAQTs.com/
Jul 23 '05 #2
John Smith wrote:

[snip]
<script defer="false" type="text/javascript">
Last time I looked, defer was a boolean attribute. A boolean attribute
does not have "true" and "false" values: its presence means "true" and
its absence "false". You seem to want the latter so don't include the
attribute at all.

The defer attribute can only have one value - defer. That is,

<script type="text/javascript" defer="defer">

In HTML, the value can be omitted entirely.
function initNavlists(){
var nav = document.getElementById('navlist');
if (nav){
var links = nav.getElementsByTagName('a');
for (var i=0;i<links.length;i++)
{
var str = links[i].innerHTML;
//alert(str);
links[i].onclick = function(){ alert(str); };
}
}
}
Don't forget to feature-detect[1] those DOM methods before using them.

[snip]
Why i always get the last item in the alert box?


The function expression you assign to the onclick property forms a
closure preventing the str variable, among other things, from being
garbage collected. Even though the function objects will be unique,
they will all have the same scope chain sharing the same variables. In
other words, str will be the same for all of them, and by the end of
the loop, str will contain the innerHTML value of the last link.

Though you could take a more complex route to solve this, it would
just be a waste of memory and time. The simplest thing to do is to
refer to the innerHTML property directly:

function initNavLists() {
function listener() {
alert(this.innerHTML);
}

/* ... */

for(var i = 0, n = links.length; i < n; ++i) {
links[i].onclick = listener;
}
}

Notice that the this operator will refer to element on which the
listener function was fired.

Hope that helps,
Mike
[1] <URL:http://www.jibbering.com/faq/faq_notes/not_browser_detect.html>

--
Michael Winter
Replace ".invalid" with ".uk" to reply by e-mail.
Jul 23 '05 #3
"John Smith" <so*****@nospam.com> wrote in message
news:42**********@news.tm.net.my...
<!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">
<body>
<div id="navcontainer">
<ul id="navlist">
<li id="active"><a href="#" id="current">Item one</a></li>
<li><a href="#">Item two</a></li>
<li><a href="#">Item three</a></li>
<li><a href="#">Item four</a></li>
<li><a href="#">Item five</a></li>
</ul>
</div>
<script defer="false" type="text/javascript">
function initNavlists(){
var nav = document.getElementById('navlist');
if (nav){
var links = nav.getElementsByTagName('a');
for (var i=0;i<links.length;i++)
{
var str = links[i].innerHTML;
//alert(str);
links[i].onclick = function(){ alert(str); };
}
}
}

initNavlists();
</script>
</body>
</html>

Why i always get the last item in the alert box?
How to get the rest?


Change links[i].onclick = function(){ alert(str); };
To links[i].onclick = function() { alert(this.innerHTML); };

Or:

<script defer="false" type="text/javascript">
function initNavlists(){
var nav = document.getElementById('navlist');
function clicked(s) { return function() { alert(s); } }
if (nav){
var links = nav.getElementsByTagName('a');
for (var i=0;i<links.length;i++)
{
var str = links[i].innerHTML;
//alert(str);
links[i].onclick = clicked(s);
}
}
}
initNavlists();
</script>

--
Grant Wagner <gw*****@agricoreunited.com>
comp.lang.javascript FAQ - http://jibbering.com/faq
Jul 23 '05 #4

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

125
by: Sarah Tanembaum | last post by:
Beside its an opensource and supported by community, what's the fundamental differences between PostgreSQL and those high-price commercial database (and some are bloated such as Oracle) from...
72
by: E. Robert Tisdale | last post by:
What makes a good C/C++ programmer? Would you be surprised if I told you that it has almost nothing to do with your knowledge of C or C++? There isn't much difference in productivity, for...
121
by: typingcat | last post by:
First of all, I'm an Asian and I need to input Japanese, Korean and so on. I've tried many PHP IDEs today, but almost non of them supported Unicode (UTF-8) file. I've found that the only Unicode...
51
by: WindAndWaves | last post by:
Can anyone tell me what is wrong with the goto command. I noticed it is one of those NEVER USE. I can understand that it may lead to confusing code, but I often use it like this: is this...
56
by: Cherrish Vaidiyan | last post by:
Frinds, Hope everyone is doing fine.i feel pointers to be the most toughest part in C. i have just completed learning pointers & arrays related portions. I need to attend technical interview on...
46
by: Keith K | last post by:
Having developed with VB since 1992, I am now VERY interested in C#. I've written several applications with C# and I do enjoy the language. What C# Needs: There are a few things that I do...
13
by: Jason Huang | last post by:
Hi, Would someone explain the following coding more detail for me? What's the ( ) for? CurrentText = (TextBox)e.Item.Cells.Controls; Thanks. Jason
98
by: tjb | last post by:
I often see code like this: /// <summary> /// Removes a node. /// </summary> /// <param name="node">The node to remove.</param> public void RemoveNode(Node node) { <...> }
9
by: Pyenos | last post by:
import cPickle, shelve could someone tell me what things are wrong with my code? class progress: PROGRESS_TABLE_ACTIONS= DEFAULT_PROGRESS_DATA_FILE="progress_data" PROGRESS_OUTCOMES=
20
by: Daniel.C | last post by:
Hello. I just copied this code from my book with no modification : #include <stdio.h> /* count characters in input; 1st version */ main() { long nc; nc = 0;
0
by: taylorcarr | last post by:
A Canon printer is a smart device known for being advanced, efficient, and reliable. It is designed for home, office, and hybrid workspace use and can also be used for a variety of purposes. However,...
0
by: Charles Arthur | last post by:
How do i turn on java script on a villaon, callus and itel keypad mobile phone
0
by: ryjfgjl | last post by:
If we have dozens or hundreds of excel to import into the database, if we use the excel import function provided by database editors such as navicat, it will be extremely tedious and time-consuming...
0
by: emmanuelkatto | last post by:
Hi All, I am Emmanuel katto from Uganda. I want to ask what challenges you've faced while migrating a website to cloud. Please let me know. Thanks! Emmanuel
0
BarryA
by: BarryA | last post by:
What are the essential steps and strategies outlined in the Data Structures and Algorithms (DSA) roadmap for aspiring data scientists? How can individuals effectively utilize this roadmap to progress...
1
by: nemocccc | last post by:
hello, everyone, I want to develop a software for my android phone for daily needs, any suggestions?
0
by: Hystou | last post by:
There are some requirements for setting up RAID: 1. The motherboard and BIOS support RAID configuration. 2. The motherboard has 2 or more available SATA protocol SSD/HDD slots (including MSATA, M.2...
0
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...
0
Oralloy
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,...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.