通过javascript从列表传递这个值

Pass this value from a list with javascript

本文关键字：javascript 列表 通过      更新时间：2023-09-26

我有以下列表:

<ul>
    <li onclick="populateComment(..this.)">very good </li>
    <li onclick="populateComment(..this.)">not so good</li>
    <li onclick="populateComment(..this.)">no t.....</li>
</ul>

和javascript: 

function populateComment() {
    document.getElementById("COMMENT").value = document.getElementById("COMMENT").value + 'THE_STRING_VALUE_FROM_THE_LIST';
}

我的想法是我有一个文本区，我通过点击列表填充它。

所以如果我点击第一个列表，文本"very good"应该被附加到文本区域。但是我不想在我的函数中重新输入文本"very good"，我可以直接将其作为this.value..这样的参数吗?它会自动获取<li> ...</li> 之间的字符串

感谢您的宝贵时间。

你要找的是:

this.textContent || this.innerText

this.textContent在所有体面的浏览器中都支持，this.innerText在旧版本的IE中需要。

您还可以将侦听器绑定到<ul>元素，而不是多次复制onclick处理程序:

// Replace <ul> with <ul id="populatefrom">
document.getElementById("populatefrom").onclick = function(ev) {
    ev = ev || window.event; //Backwards compatible with IE
    var target = ev.target;
    if (target.nodeName.toLowerCase() == "li") {
        document.getElementById("COMMENT").value += target.textContent || target.innerText;
    }
};

如果你没有任何东西，除了一个简单的文本，你也可以使用:

this.firstChild.nodeValue;

然而，如果有任何节点(粗体，span，或其他任何东西，而不是文本…即使是HTML注释)，那么这将不起作用，你需要textContent/innerText组合Rob W给。

当然你可以用jQuery这样做(还没有测试):

<ul>
    <li class="populateComment">very good </li>
    <li class="populateComment">not so good</li>
    <li class="populateComment">no t.....</li>
</ul>

和jQuery:

$('.populateComment').click(function(){
  $('#textboxID').val($(this).html());
});

工作jsfiddle: http://jsfiddle.net/zEaam/

相关文章：