Question

我有以下html表格布局：

<table id="mytable">
<tbody>
<tr><td rowspan="2">Row text</td><td><input type="text" value="" readonly /></td><td><input type="text" value="" readonly /></td><td><input type="text" value="" readonly /></td></tr>
<tr><td><input type="text" value="" /></td><td><input type="text" value="" /></td><td><input type="text" value="" /></td></tr>
</tbody>
</table>

jQuery datepicker附加了表行的每个输入字段，但第一行的所有输入字段都是只读的。现在，当用户从第二行选择任何日期时，它将在所选日期添加30天并通过jQuery将其放入第一行的相应输入字段，如下所示：

$('table#mytable > tbody> tr > td > input[type="text"]').datepicker({
      dateFormat: 'dd/mm/yy',
      changeMonth: true,
      changeYear: true,
       yearRange: '1900:2016',
        onClose: function (){
           var thisRow = $(this).closest('tr');
           var thisCell = $(this).closest('td').index();
           var thisDate = $(this).datepicker('getDate');
           thisDate.setDate(thisDate.getDate() + 30);
          thisRow.prev().find('td:eq(' + (thisCell + 1) + ') input[type="text"]').datepicker('setDate', thisDate);
        });
});

我在这里遇到两个问题：

1）我想以某种方式设置第一行输入的日期选择器，这样它就不会在点击时打开日期选择器（它只会用于显示从第二行中选择的日期+ 30天）。即第一行的日期选择器将是只读的。

2）我上面的代码是否

thisRow.prev().find('td:eq(' + (thisCell + 1) + ') input[type="text"]').datepicker('setDate', thisDate);

对于在所选日期添加30天并在第一行的相应输入字段中显示该日期有效吗？

Answer 1

如果在指定日期添加30天，您可以尝试以下代码。

 $('table#mytable > tbody> tr > td > input[type="text"]').datepicker({
        onClose: function(selectedDate, inst) { 
        var d =new Date(selectedDate);
        var day=d.getDate();
        var month=d.getMonth();
        var year=d.getFullYear();
        $(this).datepicker('setDate',new Date(year,month,day+30) );
        }
  });

希望这会对你有帮助。

Answer 2

$('.datepicker').datepicker('disable');

其中.datepicker是日期选择器的类。

Answer 3

$（“＃datepicker”）。datepicker（

//

）。attr（'readonly'，'readonly'）;

如何将readonly设置为datepicker？

3 个答案: