jQuery元素AJAX后点击

我的项目有一个使用jQuery UI选项卡的页面。每个选项卡使用AJAX调用一个文件，每个文件都显示一个列表。这些列表中的每个<li>元素都有一个像<input type = "checkbox" />这样的子元素。jQuery元素AJAX后点击

当我点击<li>上的任何位置时，我需要的是checkbox元素的选中状态或取消选中状态（取决于之前的状态）。

我已经尝试使用这样的功能，如<li onclick = "javascript: CheckboxClick();">，它工作正常，直到用户试图点击实际的复选框。然后，该函数与复选框的操作同时运行，导致它们相互取消。

我试过在$(document).ready()上使用类似版本的函数来排除复选框的子项来触发此函数，但是这些列表是使用AJAX创建的，并且没有包含初始DOM的一部分。该功能不起作用。我尝试使用click而不是on()，因为根据w3schools on() method explanation它声明“on（）方法将适用于当前和FUTURE元素（如由脚本创建的新元素）。”我没有成功。

后者尝试是这样的：

$("li.single-line.restore-manager").on("click", function() { 
    //code 

}).children('input[type="checkbox"]').click(function (e) { 

    return false; 
});

，实际上什么也没有发生。

如何使这项工作的任何想法？

来源

2013-07-11 Dimitris Damilos

不'solve'你的问题，但是当你的onclick运行自定义功能只是检查或取消自己的呢？ – We0

你是什么意思？ –

这是你在找什么？

$(document).on("click", "li.single-line.restore-manager", function (e) { 
    if (e.target.nodeName != "INPUT") { 
     var myChks = $(this).children(":checkbox"); 
     $.each(myChks, function() { 
      if ($(this).is(":checked") === true) { 
       $(this).prop("checked", false); 
      } else { 
       $(this).prop("checked", true); 
      } 
     }); 
    }; 
});

JSFIDDLE

来源

2013-07-11 13:49:45 DevlshOne

啊，我看到，踢球者是这个部分：**直到用户试图点击实际的复选框。然后，该功能与复选框的操作同时运行，导致它们相互取消。** – DevlshOne

没错。有任何想法吗？ –

我现在摆弄它。 :) – DevlshOne

更新的代码来处理复选框，点击：

$(document).on("click", 'li.single-line.restore-manager', function(e){ // Use document or parent of li which exists before `AJAX` call 
    if (e.target.nodeName != 'INPUT') { 
     // your code here 
    } 
});

来源

2013-07-11 13:39:57

不，这也行不通，但谢谢你的回复。 –

错误我有双引号'li'选择器''“li.single-line.restore-manager”'，正确的代码是''li.single-line.restore-manager''，回答更新 –

jQuery元素AJAX后点击

回答

相关问题