从jquery中的li获取所选值

从jquery中的li获取所选值,jquery,this,Jquery,This,使用jquery查找单击事件的值。每次单击delete类时,hidden变量将返回第一个hdid,而不是单击的hdid。当我使用this时,它返回整个delete类,但我只需要select类的“hdid”。问题是如何使用this将变量设置为所选hdid <form id="frmDelete" method="post" action="delete-class.php"> <ul id="class"> <l

使用jquery查找单击事件的值。每次单击
delete
类时,
hidden
变量将返回第一个
hdid
,而不是单击的
hdid
。当我使用
this
时,它返回整个
delete
类,但我只需要select类的“hdid”。问题是如何使用
this
将变量设置为所选
hdid

<form id="frmDelete" method="post" action="delete-class.php">
            <ul id="class">
                <li>
                    <div class="delete">ED 123-123<input type="hidden" name="hdid" id="hdid" value="6"/></div>
                </li>
                <li>
                    <div class="delete">EDU 121-101<input type="hidden" name="hdid" id="hdid" value="7"/></div>
                </li>
                <li>
                    <div class="delete">STU 120-456<input type="hidden" name="hdid" id="hdid" value="8"/></div>
                </li>               
            </ul>
        </form>
    </div>
    <script>
        $(function() {
            $(".delete").click(function() {
                var hidden = $('#hdid').val();
                console.log(hidden);
                console.log(this);
            });
        });
    </script>

  • ED 123-123
  • EDU 121-101
  • STU 120-456
$(函数(){ $(“.delete”)。单击(函数(){ var hidden=$('#hdid').val(); console.log(隐藏); console.log(this); }); });

id应该是唯一的

在同一页上有多个id为hdid的元素。让多个元素具有相同的ID不是一个好主意

$(function() {
    $(".delete").click(function() {
        var $div = $(this);
        console.log($div.children("input").prop("name"));
    });
});
由于使用
$('#hdid')
搜索元素,因此始终会得到第一个元素

id=”“
应该是唯一的,如果您想让多个元素成为
hdid
,请使用
class
属性。正是这一点导致了你的问题。所以“修复”html就像

<div class="delete">ABC<input type="text" name="hdid1" class="hdid" />

您的问题是,您有多个具有相同ID的元素。这实际上是不允许的,因此当询问ID为“hdid”的元素的值时,jQuery将只获取它找到的第一个元素的值

这里一个可能的解决方案是只有一个隐藏的输入字段,并在单击特定项时更新该字段的值,然后提交表单。您可以使用
data-*
属性存储要删除的项目的ID(假设您使用的是HTML 5):


  • ED 123-123
  • EDU 121-101
  • STU 120-456
$(函数(){ $(“.delete”)。单击(函数(){ $('#hdid').val($(this.data('id')); var hidden=$('#hdid').val(); console.log(隐藏); console.log(this); }); });
id=“hdid”
对于元素应该是唯一的,否则使用
class=“hdid…”
当我运行这个时它是未定义的,但是如果我对所有工作都使用相同的id。我只是使用了
class
而不是
id
,并更改了`var hidden=$(this)。find('.hdid').val();`谢谢
<div class="delete">ABC<input type="text" name="hdid1" class="hdid" />
$(function() {             
    $(".delete").click(function() {                 
        var hidden = $(this).children('input.hdid').val();                 
        console.log(hidden);                 
        console.log(this);             
    });         
}); 
<form id="frmDelete" method="post" action="delete-class.php">
    <input type="hidden" name="hdid" id="hdid" />
    <ul id="class">
        <li>
            <div class="delete" data-id="6">ED 123-123</div>
        </li>
        <li>
            <div class="delete" data-id="7">EDU 121-101</div>
        </li>
        <li>
            <div class="delete" data-id="8">STU 120-456</div>
        </li>               
    </ul>
</form>

<script>
    $(function() {
        $(".delete").click(function() {
            $('#hdid').val($(this).data('id'));
            var hidden = $('#hdid').val();
            console.log(hidden);
            console.log(this);
        });
    });
</script>