Question

我的html talbe如下

<table width='1200' border='0' cellspacing='0' cellpadding='0'>
  <tr>
    <td>Date</td>
    <td>
    <li class='demo'><div class='box'>
          <input type='text' id='from-input' maxlength='10'>
          </div>
          <div class='code-box' style='display:none;'>
          <pre class='code prettyprint'>
$('#from-input').multiDatesPicker();
                            </pre>
                        </div>
                    </li></td>
  </tr>
</table>

我的jquery脚本如下。

   $(document).ready(function(){
        var counter =2;
        $("#addButton2").click(function () {

    var newTextBoxDiv2 = $(document.createElement('div')).attr("id", 'TextBoxDiv2' + counter2);

    newTextBoxDiv2.after().html('<table width='1200' border='0' cellspacing='0' cellpadding='0'><tr><td>Date</td><td><li class='demo'><div class='box'><input type='text' id='from-input'+counter+'' maxlength='10'></div><div class='code-box' style='display:none;'><pre class='code prettyprint'>$('#from-input'+counter+'').multiDatesPicker();</pre></div></li></td></tr></table>');

newTextBoxDiv2.appendTo("#TextBoxesGroup2");
    counter++;
    });

按钮<input type='button' value='Add' id='addButton2'>，单击按钮时，html页面的相同副本将附加到html页面中的div。 Thera是html页面中具有标识from-input和jquery函数$('#from-input').multiDatesPicker();的输入字段。通过在每次单击时附加counter来更改id from-input。生成的值类似于from-input2，from-input3，from-input4等等。这是日期选择器。 日期选择器在onclick 生成的附加表中无效。任何帮助将不胜感激。谢谢你

Answer 1

首先你的代码是几个问题，任何方式尝试这个，

JsFiddle Example

$(function() {
   var counter =2;
        $("#addButton2").click(function () {

    var newTextBoxDiv2 = $(document.createElement('div')).attr("id", 'TextBoxDiv2' + counter);

    newTextBoxDiv2.after().html("<table width='1200' border='0' cellspacing='0' cellpadding='0'><tr><td>Date</td><td><li class='demo'><div class='box'><input class='multi' type='text' id='from-input_"+counter+"' maxlength='10'></div><div class='code-box' style='display:none;'>$('#from-input').multiDatesPicker();<pre class='code prettyprint'></pre></div></li></td></tr></table>");

newTextBoxDiv2.appendTo("#TextBoxesGroup2");
            $("#from-input_"+counter).multiDatesPicker();
    counter++;

    });

  });

日期选择器不使用after（）处理附加的div

1 个答案: