我想使用 javascript 获取警报框中 li 的值。(即,如果我单击 PHP,它应该在警报框中提醒 php)。但它显示未定义。请任何人帮忙解决这个问题。
我的代码是
<script type="text/javascript">
function lang1()
{
var a = document.getElementsByTagName("li").value;
alert(a);
}
</script>
<form>
<ul id="language" onclick="lang1();">
<li>PHP</li>
<li>ASP</li>
<li>JAVA</li>
<li>CQ5</li>
</ul>
</form>
getElementsByTagName https://developer.mozilla.org/en-US/docs/Web/API/document.getElementsByTagName返回一个NodeList
,即一个list的元素。但即使你访问了列表中的一个元素,li
元素没有value
属性(只有表单控件元素具有此属性)。
您可以使用.innerHTML https://developer.mozilla.org/en-US/docs/Web/API/Element.innerHTML or .textContent https://developer.mozilla.org/en-US/docs/Web/API/Node.textContent/.innterText
访问 HTML 元素的内容。
现在,您想要获取的内容li
被单击的元素。由于您将事件处理程序绑定到ul
元素,this
将始终参考ul
事件处理程序内的元素。
但是您可以通过访问来获取触发事件的元素target (or srcElement(IE)) 事件对象的属性 https://developer.mozilla.org/en-US/docs/Web/API/event.target.
W3C 兼容浏览器将事件对象作为参数传递给事件处理程序。在旧版 IE 中,事件对象可用作全局变量,window.event
。由于您使用的是内联事件处理程序,因此在这种情况下对您来说没有什么区别。
<script type="text/javascript">
function lang1(event) {
var target = event.target || event.srcElement;
alert(event.target.innerHTML);
}
</script>
<form>
<ul id="language" onclick="lang1(event);">
<li>PHP</li>
<li>ASP</li>
<li>JAVA</li>
<li>CQ5</li>
</ul>
</form>
DEMO http://jsfiddle.net/LHGdn/
我建议阅读quirksmode.org 上有关事件处理的优秀文章 http://www.quirksmode.org/js/introevents.html。它们描述了绑定事件处理程序的不同方式(内联ve,事件对象具有哪些属性以及浏览器之间的差异。
注意:内联事件处理程序对于玩具示例来说是可以的,但是一旦您要进行一些认真的开发,请使用其他方法来绑定事件处理程序。
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)