添加类后，jQuery单击事件不起作用

在我的JSP页面中，我添加了一些链接：

<a class="applicationdata" href="#" id="1">Organization Data</a>
<a class="applicationdata" href="#" id="2">Business Units</a>
<a class="applicationdata" href="#" id="6">Applications</a>
<a class="applicationdata" href="#" id="15">Data Entity</a>

它将添加一个类，

tabclick

到

，该类位于

中，带有

id=“gentab”

。它工作得很好。这是我的

代码：

<li id="applndata"><a class="tabclick" href="#appdata" target="main">Application Data</a></li>
<li id="gentab"><a href="#datacollector" target="main">General</a></li>

对于第一个链接，它运行良好。它正在警告

id。但是对于第二个
，第一个jQuery添加的
class=“tabclick”
不起作用

我尝试了
$（“a.tabclick”）.live（“click”，function（）
，但是第一个链接单击事件也不起作用。
因为
类是动态添加的，所以需要使用事件委派来注册事件处理程序

$(document).on('click', "a.tabclick", function() {
    var liId = $(this).parent("li").attr("id");
    alert(liId);        
});

.live（）
已弃用。如果要用于委派的元素，请使用具有以下语法的.on（）

$(document).on('click', "a.tabclick", function() {

此语法适用于委派事件

在document ready事件中，没有tabclick类的标记。因此，在添加tabclick类时，必须动态绑定click事件。请输入以下代码：

$("a.applicationdata").click(function() {
    var appid = $(this).attr("id");

   $('#gentab a').addClass("tabclick")
    .click(function() {
          var liId = $(this).parent("li").attr("id");
         alert(liId);        
      });


 $('#gentab a').attr('href', '#datacollector');

});

您应该使用以下选项：

$('#gentab').on('click', 'a.tabclick', function(event) {
    event.preventDefault();
    var liId = $(this).closest("li").attr("id");
    alert(liId);  
});

这会将您的事件附加到
#gentab
元素中的任何锚定，
减少必须检查整个
文档的范围
元素树并提高效率。
基于@Arun p Johny这是输入的方式：

<input type="button" class="btEdit" id="myButton1">

这将登录到控制台：myButton1。
正如@Arun所说的，你需要以友好的方式添加事件，但在我的情况下，你不需要先打电话给家长

更新

尽管最好说：

$(document).on('click', "input.btEdit", function () {
    var id = $(this).id;
    console.log(id);
});

因为这是JQuery的语法，即使两者都可以工作。
这里还有另一个解决方案，bind方法

$(document).bind('click', ".intro", function() {
    var liId = $(this).parent("li").attr("id");
    alert(liId);        
});

干杯：）
我知道这是一个古老的话题……但以上这些对我都没有帮助。
在搜索了很多东西并尝试了所有东西之后…我想到了这个

首先从$（document.ready）部分中删除单击代码，并将其放在单独的部分中。
然后将您的点击代码放入$（function（）{……}）；代码

像这样：

<script>
  $(function(){
    //your click code
    $("a.tabclick").on('click',function() {
      //do something
    });
  });
</script>


$（函数（）{
//你的点击代码
$（“a.tabclick”）。在（'click'，function（）上{
//做点什么
});
});
使用“on”事件委派关于事件委派，请参阅此SO问题：是
this.id
还是
$（this.attr（“id”）
？嘿@ShijuKBabu我尝试了$（this.attr（“id”），但我遇到了一个异常。但这在Google Chrome上运行得很好，你使用的是另一个失败的浏览器吗？我没有尝试。我已经得到了我想要的答案。这是输入按钮。我只是想问一下，因为我正在使用
$（this）.attr（“id”）
来获取当前对象的id，它对meThis有效。如果在代码执行后添加整个元素，它也可以工作，太棒了！
$(document).on('click', "input.btEdit", function () {
    var id = $(this).id;
    console.log(id);
});

$(document).bind('click', ".intro", function() {
    var liId = $(this).parent("li").attr("id");
    alert(liId);        
});

<script>
  $(function(){
    //your click code
    $("a.tabclick").on('click',function() {
      //do something
    });
  });
</script>