如何将jquery ui样式应用于动态生成的元素

Question

我正在使用jquery生成文本字段。我正在使用jQuery UI来设计窗体。我的问题是动态生成的元素，没有得到jQuery的用户界面的CSS：

var index = 0; 
    $('#btn_generate').live('click', function(){ 
       var tr = $("<tr>").appendTo('#tbl_body'); 
       var td = $("<td>").appendTo(tr); 
       var txt = $("<label>").attr({'for' : index}).appendTo(td).html('content' + index + ':').css({'color' : 'white'}); 
       $("<input>").attr({'type' : 'text', 'name' : 'field[]', 'id' : index}).appendTo(td); 
       index++; 
      }); 

如何解决这个问题呢？

Answer 1

我猜你要jQuery的样式表单最初在文件准备好了？

如果是这样，你有两个选择......

1. 重新运行最初的jQuery每次产生额外的表单元素
2. 时间手动所需的jQuery UI的类添加到每个新对象。 （.addClass很好的工作IMO）

如果我找错了树，让我知道:)

Answer 2

你可以尝试这样的事：

var index = 0; 
$('#btn_generate').live('click', function(){ 
      var tr = $("<tr>").appendTo('#tbl_body'); 
      var td = $("<td>").appendTo(tr); 
      var txt = $("<label>").attr({'for' : index}).appendTo(td).html('content' + index + ':').css({'color' : 'white'}); 
      $("<input>").attr({'type' : 'text', 'name' : 'field[]', 'id' : index}).appendTo(td); 

//as you have given id=index to your input 
    $('#'+index).yourjqueryuifunction(); 
      index++; 
     });