我正在尝试获取当前列表项的文本值。
我尝试使用$(this).text()
和$(this).parent().text()
,它们都返回undefined
或null
。我认为解决方案相对简单,但我无法解决这个问题。
答案 0 :(得分:1)
我知道这与Zakaria Acharki的答案类似,但这个更短。
$(function() {
$('li').click(function() {
console.log($(this).text());
});
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<ul>
<li>Coffee <button>something</button></li>
<li>Tea <button>something</button></li>
<li>Milk <button>something</button></li>
</ul>
&#13;
请注意,使用此功能,也会获得按钮内的文字。为避免这种情况,请改用:
$(function() {
$('li').click(function() {
console.log($(this).clone().children().remove().end().text());
});
});
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<ul>
<li>Coffee <button>something</button></li>
<li>Tea <button>something</button></li>
<li>Milk <button>something</button></li>
</ul>
&#13;
在这个惊人的答案中找到:Using .text() to retrieve only text not nested in child tags
编辑:或者,您可以将文本换成a并从中获取文本:
$(function() {
$('li').click(function() {
console.log($(this).children('span').text());
});
});
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<ul>
<li><span>Coffee</span><button>something</button></li>
<li><span>Tea</span><button>something</button></li>
<li><span>Milk</span><button>something</button></li>
</ul>
&#13;
答案 1 :(得分:1)
在onclick属性中,使用this
作为参数调用函数。然后在函数中,您将需要获取整个文本,并删除按钮文本。
此方法不依赖于ID,可用于li
标记内的任何按钮。
示例HTML
<li id="ED_H">
john.live.com
<button onclick="editUnit(this)" type="button">Edit</button>
</li>
的JavaScript
var editUnit = function (button) {
var buttonText = button.innerText;
var fullText = button.parentElement.innerText;
var wanted = fullText.replace(buttonText, '');
console.log(wanted);
};
答案 2 :(得分:0)
如果您使用点击事件$(this).text()
应该有效。
$(function(){
$('body').on('click', 'li', function(){
console.log( $(this).text() );
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul>
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ul>
答案 3 :(得分:0)
您可以在要获取文本的childNodes[0]
元素上使用li
,该元素获取第一个childNode
(示例中的文本节点),然后获取该节点的值nodeValue
并使用trim()
删除任何空格。
var elEd_h = document.getElementById("ED_H");
console.log(elEd_h.childNodes[0].nodeValue.trim());
&#13;
<li id="ED_H">
john.live.com
<button>
Edit
</button>
</li>
&#13;