jquery-ui – jquery datepicker不会在动态添加的输入上显示

2019年8月4日 207次阅读

我有一张桌子,每个单元格都是表格的一部分.在我的表单中,我在输入元素上有一个
jquery datepicker：

<form method="post" action="test.php">
                <table>
                    <tr>
                     ....
                        <td>
                            <input type="text" id="date" name="test"/>
                        </td>
                     ....
                    </tr>
                </table>
                <button type="button" id="addLine">Add line</button>
                <button id="submit" type="submit">Submit</button>
            </form>

我像这样添加我的datepicker：

$(document).ready(function() {
            $('#date').datepicker({showAnim: "slideDown"});   
        });

问题出现了…我想在我的表中添加一行,但是datepicker不适用于新添加的行…

$(document).ready(function() {
            $('#addLine').click(function() {
                var line = $('<tr>...<input type="text" id="date" name="test"/>...</tr>');
                $('table').append(line);
              });
        });

出现新行,但是当我想插入一个值时,datepicker不会在新创建的行上弹出.

我试图在我的.click中添加另一个$(‘#date’).datepiker()…(函数……但是它不起作用.我也尝试用方法刷新dom调用page()..但是我有一个错误,该方法在元素上不存在.我需要你的帮助！

谢谢

最佳答案 您不能有多个具有相同值的ID,这可能会导致您的一些问题.请改用类名,例如class =“date”

<input type="text" class="date" name="test"/>

由于您是动态添加内容,因此在加载后您可以触发datePicker函数.

所以：

line.find(".date").datepicker({showAnim: "slideDown"})

样品：http://jsbin.com/omoyiy/2/edit

点赞