-2

我有一个带有标签的多个 li 标签，因为跨度在 li 标签内，它们具有相同的 id 名称。我希望在选择Pataticular LI标签时能够在跨度标签中获取值。这是我的html代码 

<li>
    <form action="" method="post" name="topdivform">
        <span id="editedpart" title="first div"><a href="#" title="edit" id="edit" onclick="showeditpage()">first div</a></span>
    </form>
</li>
<li>
    <form action="" method="post" name="topdivform">
        <span id="editedpart" title="second div"><a href="#" title="edit" id="edit" onclick="showeditpage()">second div</a></span>
    </form>
</li>
<li>
    <form action="" method="post" name="topdivform">
        <span id="editedpart" title="third div"><a href="#" title="edit" id="edit" onclick="showeditpage()">third div</a></span>
    </form>
</li>

这是我的javascript

var elem = document.getElementById("editedpart");
var str ="";
for(var i = 0; i< elem.length; ++i){
    str = elem[i].innerText;
    alert(str);

}

它没有得到跨度标签内的文本谢谢

4

3 回答 3

4

由于您为多个元素提供相同的 id，因此无法预测调用 GetElementById 将返回哪个元素。您需要重新构建标记以避免为多个元素提供相同的 id。

于 2013-04-28T05:03:54.703 回答
2 
var elem = document.getElementsByName("topdivform");

var str ="";
for(var i = 0; i< elem.length; ++i){
    str = elem[i].textContent || elem[i].innerText;
    alert(str);
}

如果您需要更具体地选择 DOM，您可以使用querySelectorAll()，尽管 IE6/7 不支持它。

var elem = document.querySelectorAll("li > form[name=topdivform] > span > a[title=edit]");
于 2013-04-28T05:09:02.827 回答
0

您可以将事件监听器 ( https://developer.mozilla.org/en-US/docs/DOM/EventTarget.addEventListener ) 添加到 li 的单击事件中，并将子跨度节点中的全局变量设置为您的选择值。您可以使用类名 ( <span class="isSelected"></span>) 或data-*( <span data-selected="true"></span>) 来表示在单击事件期间“选择”了哪个跨度。第一个很好，因为您只需根据需要更改该值。第二个要求您在每次选择更改时解析 DOM 并替换该属性或类。

于 2013-04-28T05:56:20.430 回答