How do you change a function name inside a for loop in javascript
Question
I want to change the function name inside of a for loop to something like this.
<script>
for (var x=1;x<10;x++){
function name_x(){
code
}
</script>
So, 10 functions are produced with the names name_1, name_2 etc.
Thanks
Edit:
This is what I need a for loop around to create 5 functions id_1, id_2, id_3, id_4, id_5
<html>
<head>
<script>
function id_1(a){
var id = document.getElementById(a);
if (id.innerHTML==="innerHTML2"){
id.innerHTML="innerHTML1";
}
else if (id.innerHTML==="innerHTML1"){
id.innerHTML="innerHTML2";
}
}
</script>
</head>
<body>
<a id="id1" href="javascript:id_1('id')">innerHTML1</a>
<a id="id2" href="javascript:id_2('id')">innerHTML1</a>
<a id="id3" href="javascript:id_3('id')">innerHTML1</a>
<a id="id4" href="javascript:id_4('id')">innerHTML1</a>
<a id="id5" href="javascript:id_5('id')">innerHTML1</a>
</body>
</html>
3 answers
solution1
3 2013-03-07 21:51:47
This looks pretty nefarious, but if you're in a browser you could use window as the global object. Otherwise, define some object to house the methods:
var obj = {}, x;
for (x = 1; x < 10; x++) {
obj['name_' + x]() { /* code */ }
}
Then you can call via obj.name_1() or obj['name_1']() .
solution2
3 2013-03-07 21:53:29
You can create an array of functions instead:
var fs = [];
for (var x = 1; x < 10; x++){
fs.push( function() {
/* code */
});
}
fs[1](); // call second function
You could use an object instead, but I wouldn't recommend it.
solution3
1 2013-03-07 22:22:39
Since you have code that should apply directly to the link you clicked on, you can pass a reference to the link using this . Also, the javascript code will need to be placed in onclick , not href . If you need an href value to make it appear like a link, you can use # :
<a id="id1" href="#" onclick="javascript:swapContents(this);">innerHTML1</a>
Then you can use the argument passed in as a reference to the element (it is a good programming practice to use meaningful function names, so I've renamed the function to swapContents ):
function swapContents(el){
if (el.innerHTML === "innerHTML2"){
el.innerHTML = "innerHTML1";
} else if (el.innerHTML === "innerHTML1"){
el.innerHTML = "innerHTML2";
}
}
Also, all elements should have a unique id value according to the HTML spec. If you want them to be unified in some way, give them the same class or name , or a custom made-up attribute:
<a id="id1" class="id" href="#" onclick="javascript:swapContents(this);">innerHTML1</a>
<a id="id2" class="id" href="#" onclick="javascript:swapContents(this);">innerHTML1</a>
<a id="id3" class="id" href="#" onclick="javascript:swapContents(this);">innerHTML1</a>
<a id="id4" class="id" href="#" onclick="javascript:swapContents(this);">innerHTML1</a>
<a id="id5" class="id" href="#" onclick="javascript:swapContents(this);">innerHTML1</a>
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.