Question

我有以下脚本：

$(function() {
   $( 'input[id^="event_"' ).each(function() {
        this.datetimepicker({
            stepMinute: 15  
        });
    }); 
});

通常应用datetimepicker小部件涉及此代码（在页面上进一步工作）：

$(function() {
    $( "#datepicker" ).datetimepicker({
        stepMinute: 15  
    });
});

它应该做的是将datetimepicker小部件应用于此生成代码中的每个输入框：

<table>
    <thead>
        <tr>
            <td>Event Name</td>
            <td>Event Date</td>
            <td></td>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td><input type="text" id="1" value="Opening" /></td>
            <td><input type="text" id="event_1" value="2011-09-15 20:30:00" /></td>
            <td>Save stuff here?</td>
        </tr>
        <tr>
            <td><input type="text" id="2" value="First Act" /></td>
            <td><input type="text" id="event_2" value="2011-09-15 20:45:00" /></td>
            <td>Save stuff here?</td>
        </tr>
        <tr>
            <td><input type="text" id="3" value="Some Event" /></td>
            <td><input type="text" id="event_3" value="2011-09-16 20:00:00" /></td>
            <td>Save stuff here?</td>
        </tr>
        <tr>
            <td><input type="text" id="4" value="Some Other Event" /></td>
            <td><input type="text" id="event_4" value="2011-09-17 20:00:00" /></td>
            <td>Save stuff here?</td>
        </tr>
        <tr>
            <td><input type="text" id="30" value="1234" /></td>
            <td><input type="text" id="event_30" value="2011-09-30 11:00:00" /></td>
            <td>Save stuff here?</td>
        </tr>
        <tr>
            <td><input type="text" id="32" value="Statement Check" /></td>
            <td><input type="text" id="event_32" value="2011-09-29 10:30:00" /></td>
            <td>Save stuff here?</td>
        </tr>
    </tbody>
</table>

我95％确定$(function() { ... });块中的语法错误，但我不确定哪里出错。

编辑：作为旁注，这最终将通过AJAX调用编辑列出的事件。因此，每一行都是一个需要在编辑后进行单独保存的事件。

先谢谢所有输入/建议/解决方案！

Answer 1

在each函数中，this引用本机DOM节点，该节点没有名称为datetimepicker的方法。要使用datetimepicker，您必须通过将其传递给jQuery构造函数$(this)来创建一个jQuery对象：

$(function() {
   $( 'input[id^="event_"]' ).each(function() {
        $(this).datetimepicker({
            stepMinute: 15  
        });
    }); 
});

但是，你根本不需要这个。您可以完全放弃each，并直接在原始集合上调用datetimepicker：

$(function() {
   $( 'input[id^="event_"]' ).datetimepicker({
        stepMinute: 15  
   });
});

将JQuery小部件应用于动态元素我缺少什么？

1 个答案: