在jquery mobile中为动态创建的复选框添加事件

时间:2013-08-22 10:57:30

标签: jquery jquery-mobile

我在页面中动态创建了我的复选框。我想为所有复选框添加点击事件 动态创建的。

这是我的代码。

<div data-role="fieldcontain">
         <fieldset data-role="controlgroup" id="br">

        </fieldset> 
</div>

我动态创建了复选框并附加到fieldset。

$.getJSON("http://localhost/WebSite/",
    function(data){ 
    var branchOp="";
      $.each(data.branch, function(i,item){   
         branchOp += '<input type="checkbox" name="branch" id="'+item.branchCode+'" value="'+item.branchCode+'" class="branch"><label for="'+item.branchCode+'">'+item.branchName+'</label>'; 
         $(item.branchCode).addClass("intro");     
      });
      $('#br').append(branchOp).trigger( "create" );  
      });

我使用on(),live(),deligate()方法在复选框上添加事件处理程序。

$('#br').delegate('click','input:checkbox', function(event) {
  alert('selected');
 }); 



$('#br').on('click','input:checkbox', function(event) {
alert('selected');
});

没有什么对我有用......

3 个答案:

答案 0 :(得分:29)

使用复选框/单选按钮,使用change事件。

  

<强> Demo

$(document).on('change', '[type=checkbox]', function() {
// code here
}); 

此外,您可以使用click但在包装复选框的div上。

$(document).on('click', 'div.ui-checkbox', function() {
  // code here
});

答案 1 :(得分:1)

对于可折叠列表(或任何内容)中的dinamically添加按钮,我执行此操作:

$(document).on("click", "#listaEntrada input", function(evt) {
        var txSeleccionado = $(this).text(); //<-El Texto Seleccionado
        console.log(evt);
});

答案 2 :(得分:0)

试试这个,它适用于动态添加的复选框。

$(document).on("click", "INPUT[id^=checkboxId_]", function (event) {
   var targetId = event.target.id;

   if ($("#" + targetId + ":checked").length > 0) {
      alert('checked');
   }
   else {
      alert('unchecked');
   }
});