Question

我想用jquery：

获取ul中的li项的文本值

     <ul id=list"><li>Milk<button class="check">Check</button></li>
    <li>Bread<button class="check">Check</button></li>
    <li>Eggs<button class="check">Check</button></li></ul>

我试过了：

 $('.check').parent().val();

但这并不起作用，并返回0作为值。基本上我想在单击检查按钮时定位li项的值。

Answer 1

您的<li>项目实际上没有jquery / javascript所理解的值。相反，它们只在列表项中包含文本。此外，如果您只是尝试抓住.text()中的<li>，您还会从按钮本身获取文本，因为它位于列表项中。

您可以采取几种不同的方法。将文本换行<span>，然后使用jquery在单击按钮后找到该文本。或者你可以简单地将一个值作为数据属性分配给列表项本身，然后使用jquery抓取它。

<li data-val="eggs">Eggs
    <button class="check-val">Check</button>
</li>

$(".check-val").on("click", function () {
    alert($(this).parent().attr('data-val'));
});

请参阅此小提琴，其中显示了不同的方法：http://jsfiddle.net/mark47/uyzmbmwt/

Answer 2

点击按钮即可获得标签：

$(".check").on("click",function(){
        alert ($(this).parent().children("label").text());
    });

Answer 3

当你说价值时，也许你的意思是李里面的文字？如果是这样，您可以摆脱按钮，将其类分配给li本身，然后单击文本：

$('.check').click(function () {
    alert($(this).html();
});

你可以将它设计成看起来像一个按钮。或者，如果你想保留按钮，你可以给它一个id并抓住它：

$('.check').click(function () {
    alert($(this).attr('id');
});

Answer 4

试试这个：

$('.check').click(function(){ var value = $(this).parent().first().children().html();})

Answer 5

使用text()代替val()，虽然它会包含按钮的值，但我们可以使用split()和join()将其删除。只是为了获得被点击的父级内部的值。

＆＃13;

$('.check').on("click", function () {
    var val = $(this).parent().text().split("Check").join("");
    alert(val);
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<ul id="list">
    <li>Milk
        <button class="check">Check</button>
    </li>
    <li>Bread
        <button class="check">Check</button>
    </li>
    <li>Eggs
        <button class="check">Check</button>
    </li>
</ul>

＆＃13;

如何使用jquery在ul中定位li元素

5 个答案: