在 JavaScript 中获取跨度的 id。
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/13644729/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Get id of a span in JavaScript.
提问by user1865365
I want to get the span id in JavaScript following code always returning M26 but I want different values on different click M26 or M27:
我想在 JavaScript 中获取 span id 以下代码总是返回 M26 但我想要不同的点击 M26 或 M27 上的不同值：
function clickHandler() {
var xid= document.getElementsByTagName("span");
var xsp= xid[0].id;
alert(xsp);
}
}
<html>
<BODY LANGUAGE = "javascript" onClick = "clickHandler();">
<a href="javascript:void(0)"><u><b><span id=M26>2011-
2012</span></b></u></a>
<div id=c26 STYLE="display:none">
<a href="javascript:void(0)"><u><b><span id=M27>2012-
2013</span></b></u></a>
<div id=c27 STYLE="display:none">
</body>
</html>
回答by Jon Taylor
The problem you are facing is that var xid= document.getElementsByTagName("span");gets all spans on the page regardless of where you click.
您面临的问题是，var xid= document.getElementsByTagName("span");无论您单击何处，都会获得页面上的所有跨度。
To solve this problem you should just pass a reference to the clicked object within the function. For example:
要解决这个问题，您应该只在函数内传递对单击对象的引用。例如：
<span id=M26 onclick="clickHandler(this);" >2011-2012</span>
Then in your javascript code:
然后在您的 javascript 代码中：
function clickHandler(object) {
alert(object.id);
}
However it is a good idea to bind the events within javascript rather than inline in the html tags.
然而，在 javascript 中绑定事件而不是内联在 html 标签中是个好主意。
This articledescribes the different ways in which you can bind events to elements.
该文章描述了可以绑定事件元素的不同方式。
回答by Elias Van Ootegem
There are several ways to get the id of the element that has just been clicked:
有几种方法可以获取刚刚被点击的元素的id：
Pass a reference to thisto the handler:
传递this对处理程序的引用：
onclick="handlerFunc(this);">
Or, better yet, pass the event objectto the handler, this allows you to manipulate the event's behaviour, too:
或者，更好的是，将事件对象传递给处理程序，这也允许您操纵事件的行为：
onclick='handlerFunc(event);'>
//in JS:
function handlerFunc(e)
{
e = e || window.event;
var element = e.target || e.srcElement;
element.id;//<-- the target/source of the event (ie the element that was clicked)
if (e.preventDefault)
{//a couple of methods to manipulate the event
e.preventDefault();
e.stopPropagation();
}
e.returnValue = false;
e.cancelBubble = true;
}
回答by Dineshkani
You can use getAttribute() function for this...
您可以为此使用 getAttribute() 函数...
function clickHandler() {
var xid= document.getElementsByTagName("span");
var xsp= xid[0].getAttribute('id');
alert(xsp);
}
<html>
<body LANGUAGE = "javascript" onload = "clickHandler();">
<a href="javascript:void(0)"><u><b><span id=M26>2011-
2012</span></b></u></a>
<div id=c26 STYLE="display:none">
<a href="javascript:void(0)"><u><b><span id=M27>2012-
2013</span></b></u></a>
<div id=c27 STYLE="display:none">
</body>
</html>
