如何从列表中获取动态ID?

时间:2017-02-06 06:55:34

标签: jquery

出于某种原因,当我点击其中一个链接时,下面的代码并没有提醒我正确的数据ID。

这就是我所拥有的:

HTML

<a class="margin-0 size-9 serve" data-toggle="modal" data-target="#myModal2" data-id="3">Hello</a></p>
<a class="margin-0 size-9 serve" data-toggle="modal" data-target="#myModal2" data-id="4">Test</a></p>

Jquery的

$(".serve").click(function(){ // Click to only happen on serve links
   alert($(this).attr('data-id'));
});

提前致谢

4 个答案:

答案 0 :(得分:4)

如果您的页面是动态创建具有类名称服务的元素,您可以将事件绑定到已存在的父级,通常是文档。

$(document).on("click", ".serve", function (event) {
   alert($(this).data('id'));
});

答案 1 :(得分:2)

工作正常。如果元素是在呈现DOM后动态生成的,那么Dommmmm的答案可能会有所帮助。

$(".serve").click(function(){ // Click to only happen on serve links
   alert($(this).attr('data-id'));
});

https://jsfiddle.net/n21ozzzr/

答案 2 :(得分:1)

对于data,请使用$(this).data("id") :) 对于复合数据(例如data-foo-bar),它是$(this).data("fooBar")

答案 3 :(得分:0)

我假设您正在为您的网页动态生成元素?

您必须为您生成的每个新动态元素启动一个单击事件处理程序,并且现有的事件处理程序不适用于新生成的DOM元素。

$(".serve")仅适用于注册事件处理程序时出现的元素。

要解决此问题,您可以为动态添加的每个新元素实例化事件处理程序:

例如

function generateNewElementToPage() {
    var newElement;

    // your code here    

    $(parentContainer).append(newElement);  // append your new element to page
    $(newElement).click(function(){  // add event handler for newly created element
        // do stuff here when event handler is triggered
    });
}