Alrighty then. Before I get started, I did search for this, I realize there are other threads on this topic, but none of them answered my question well.
So what I am trying to do is when a tag is clicked, it creates a variable inside of the onClick attribute that can be accessed from a function to be used with a case switch.
1) Can variables be created in the onClick attribute?
2) Can multiple commands be executed in the onClick attribute? Like : onClick="alert('Boo!'); afunction();"
?
I apologize for the lack of code, but I am using an apple iPad, and they don't use the tab button or indents, blah blah.. Heres what I tried:
[..omitted..]
var item = "null";
function executeFunction(){
switch(item){
case "item1":
document.getElementById("div1").style.display='block';
document.getElementById("div2").style.display='none';
document.getElementById("div3").style.display='none';
document.getElementById("div4").style.display='none';
break;
case "item1":
document.getElementById("div1").style.display='block';
document.getElementById("div2").style.display='none';
document.getElementById("div3").style.display='none';
document.getElementById("div4").style.display='none';
break;
case "item2":
document.getElementById("div1").style.display='none';
document.getElementById("div2").style.display='block';
document.getElementById("div3").style.display='none';
document.getElementById("div4").style.display='none';
break;
case "item3":
document.getElementById("div1").style.display='none';
document.getElementById("div2").style.display='none';
document.getElementById("div3").style.display=block';
document.getElementById("div4").style.display='none';
break;
case "item4":
document.getElementById("div1").style.display='none';
document.getElementById("div2").style.display='none';
document.getElementById("div3").style.display='none';
document.getElementById("div4").style.display='block';
break;
}
}
</script>
<ul>
<li onClick="item = 'item1'; executeFunction();">Some item</li>
<li onClick="item = 'item2'; executeFunction();">Some other item</li>
<li onClick="item = 'item3'; executeFunction();">Some flying reptile</li>
<li onClick="item = 'item4'; executeFunction();">Some psilocin</li>
</ul>
[..omitted..]
OK, first multiple commands can be used, separated by semicolons; However, it is generally not recommended ... you might try creating a master function or a series of them so that only one function has to be mentioned in the HTML code.
Then, you don't need to create the variables ... try this
<li onClick="executeFunction('item1');">Some item</li>
... then, the executeFunction
would be like this ...
function executeFunction(item) {
document.getElementById("div1").style.display='none';
document.getElementById("div2").style.display='none';
document.getElementById("div3").style.display='none';
document.getElementById("div4").style.display='none';
switch(item){
case "item1":
document.getElementById("div1").style.display='block';
break;
case "item2":
document.getElementById("div2").style.display='block';
break;
case "item3":
document.getElementById("div3").style.display='block';
break;
case "item4":
document.getElementById("div4").style.display='block';
break;
}
}
做: onClick="var='X'; doThis()"。
用分号分隔 onClick 中的 javascript 命令。
简单地:
onclick="varname = value"
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.