表格单元格上的jQuery DatePicker,带有html5内容的可编辑属性,没有输入标记

时间:2016-04-03 13:58:39

标签: javascript jquery html html5 datepicker

我有一个由PHP生成的动态表。可以使用contenteditable的{​​{1}} attr来修改表格的单元格。

我已经像这样初步化了html5

jquery datepicker

因为它为我的单元格添加了$("table").find("tr").each(function() { $(this).find("td.date-selector").datepicker( { dateFormat: 'yy-mm-dd' } ); }); ,所以效果非常好,生成的id就是这样。

html

现在当我点击我初始化<table class="table"> <tbody> <tr> <th>Post_Name</th> <th>Post_Expectations</th> <th>Last_Date</th> <th>Location</th> <th>Queue</th> <th></th> <th></th> </tr> <tr> <td contenteditable="true">Marketing Manager</td> <td contenteditable="true">Lorem ipsum dolor sit amet</td> <td contenteditable="true" class="date-selector" id="dp1459690831245">2016-02-14</td> <td contenteditable="true">Coimbatore</td> <td contenteditable="true">0</td> <td> <span class="table-remove-careers glyphicon glyphicon-remove table-remove-id"></span> </td> <td> <span class="table-up-careers glyphicon glyphicon-arrow-up table-up-id"></span> <span class="table-down-careers glyphicon glyphicon-arrow-down table-down-id"></span> </td> </tr> <tr> <td contenteditable="true">Server Admin</td> <td contenteditable="true">Lorem ipsum dolor sit amet</td> <td contenteditable="true" class="date-selector" id="dp1459690831246">2016-05-15</td> <td contenteditable="true">Chennai</td> <td contenteditable="true">1</td> <td> <span class="table-remove-careers glyphicon glyphicon-remove table-remove-id"></span> </td> <td> <span class="table-up-careers glyphicon glyphicon-arrow-up table-up-id"></span> <span class="table-down-careers glyphicon glyphicon-arrow-down table-down-id"></span> </td> </tr> <!-- This is our clonable table line --> <tr class="hide"> <td contenteditable="true">Post Name</td> <td contenteditable="true">Post Expectations .. (200 words)</td> <td contenteditable="true">Location</td> <td contenteditable="true" class="date-selector" id="dp1459690831247">Last Date</td> <td contenteditable="true">0</td> <td> <span class="table-remove-careers glyphicon glyphicon-remove table-remove-id"></span> </td> <td> <span class="table-up-careers glyphicon glyphicon-arrow-up table-up-id"></span> <span class="table-down-careers glyphicon glyphicon-arrow-down table-down-id"></span> </td> </tr> </tbody> </table> 的字段时,它没有显示出来。在网上做了一些研究,它表明 jQuery DatePicker 仅适用于输入标签或按钮点击。是否可以在datepicker contenteditable上显示?

我需要这个,因为我正在创建所有td的json并将其发送到服务器。在tr中使用input标记会破坏td

0 个答案:

没有答案