Question

我需要获取点击的div的ID。

现在当我点击状态类时，我返回了一个未定义的id。

这是我的javascript代码

jQuery(document).ready(function() {
    $(".status").bind('click', $.proxy(function() {
        var status = $(this).attr('id');
        alert(status);
    }, this));
});

和HTML

<div class="status" id="s_1">111111</div>
<div class="status" id="s_3">33333</div>
<div class="status" id="s_2">222222</div>

我应该如何获得正确的id值？

Answer 1

我不确定你为什么要使用$ .proxy。删除它应该可以获得所需的结果。

$('.status').click(function(event) {
    var status = $(this).attr('id');
});

如果您仍想使用代理，则可以通过event.currentTarget

访问点击的元素

$(".status").bind('click', $.proxy(function(event) {
    var status = $(event.currentTarget).attr('id');
    alert(status);
}, this));

Answer 2

怎么样：

$('div').on('click', function(){
    alert($(this).attr("id"));
});

这是否只适用于类status的div？如果是这样，请尝试：

$('div.status').on('click', function(){
    alert($(this).attr("id"));
});

Answer 3

使用event.target引用该元素

jQuery(document).ready(function() {
        $(".status").bind('click', $.proxy(function(event) {
            var status = $(event.target).attr('id');
          alert(status);
    }, this));
});

查看实际操作：http://jsfiddle.net/vNaqR/

Answer 4

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

Answer 5

PROXY问题的解释：

使用$ .proxy（）小心。它使用指定的上下文（此处为参数2）调用函数（此处为参数1），而不是使用触发事件的上下文。

在主要问题中，指定的上下文是$（document）所以。通过这种方式，函数尝试获取文档的ID而不是触发事件的对象的ID（$（'。status'）元素）。

Answer 6

当我点击按钮时，我试图显示隐藏的div，然后每次用户点击按钮显示更多索引。

如果我在添加模式下没有编辑（在编辑时显示div）

，那么列表上的内容始终为空

from database import db_session

JS：

                       <li>
                        <button type="button" name="addAnotherButton" class="btnFwd gradient smButtonStyling" 
                        onClick="showInput();">
                            <img src="/Common/web/static/images/add.png" class="smbtnIcon" />
                            Add Another 
                    </button>
                </li>

                <li>
                           <c:forEach items="${planInfoList}" var="planInfo" varStatus="status">
                        <div id="uploadBody[${status.index}]" style='display = none'>
                            <label class="adminFormLabel">Title:</label>
                            <form:input path="planInfoList[${status.index}].title" onfocus="this.select();" maxlength="50" size="30"/>
                            <label class="adminFormLabel">Plan Number:</label>
                            <form:input path="planInfoList[${status.index}].planNumber" size="10" maxlength="10"/>
                        </div>
                    </c:forEach>
                </li>

Answer 7

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
    $(".divField").click(function(){
        alert("id : " + $(this).attr("id"));
    });

});
</script>
</head>
<body>
<h1>For finding id click below text</h1>
<div id="id1" value="Example 1" class="divField">My id is <b>id1</b></div>
<div id="id2" value="Example 2" class="divField">My id is <b>id2</b></div>

</body>
</html>

我如何使用jQuery获取已被点击的div的ID？

7 个答案: