jQuery datepicker输入字段设置为“不可点击”

我有两个datepicker输入字段 - 一个设置为活动，第二个为readonly，但它看起来像readonly不能使用datepicker。下面的代码。jQuery datepicker输入字段设置为“不可点击”

HTML：

<fieldset> 
     <label for="dataStart">Start Date</label> 
     <input type="text" style="width: 88px;" class="datepicker" id="dataStart" size="10" name="dataStart" /> 
    </fieldset> 
    <fieldset> 
     <label for="dataEnd">End Date</label> 
     <input type="text" style="width: 88px;" class="end_date" id="dataEnd" size="10" name="dataEnd" value="" readonly /> 
    </fieldset> 
<div>Days counted between dates: <span id="calculated"></span></div>

的jQuery：

$(document).ready(function() { 
    $("#dataStart").datepicker({ 
     minDate: '+1d', 
     changeMonth: true, 
     changeYear: true, 
     dateFormat: 'mm/dd/yy', 
     onSelect: function(date){ 
      var dates = date.split('/'); 
      var lastDate = new Date(dates[2], dates[0], 0); 
      var y = lastDate.getFullYear(), m = lastDate.getMonth(), d = lastDate.getDate(); 
      m = ('0'+ (m+1)).slice(-2); 

      $('#dataEnd').val(m+'/'+d+'/'+y); 

      var start = $('#dataStart').datepicker('getDate'); 
      $('#dataEnd').datepicker({dateFormat: 'mm/dd/yy'}).datepicker('setDate', m+'/'+d+'/'+y); 
      var end = $('#dataEnd').datepicker('getDate'); 
      var days = ((end - start)/1000/60/60/24)+1; 

      $('#calculated').text(days);   
     } 
    }); 
});

和JSFiddle

来源

2014-12-03 JackTheKnife

它是什么，你想干什么？你是否需要第二个输入有一个日期选择器，或者你是否只需要根据第一个日期选择器中选择的值填充值？ – j08691 2014-12-03 16:09:18

只读输入无法修改！你想要的是禁用属性。但是，如果您想保持只读，则必须在尝试更改该值之前将javascript设置为只读为false。这意味着你的代码：'$（'＃dataEnd'）。removeAttr（'readonly'）; ...设置值...然后重置为只读...'$（'＃dataEnd'）。attr（'readonly'，'readonly'）;' – scraaappy 2014-12-03 16:30:29

@ j08691第二个输入字段是显示基于第一个日期选择器，但我需要将该日期传递给下一步。 – JackTheKnife 2014-12-03 16:37:31

如果您不需要在第二输入一个日期选择器，那么你可以不实例像你目前正在做，并用此代替：

删除：

$('#dataEnd').datepicker({dateFormat: 'mm/dd/yy'}).datepicker('setDate', m+'/'+d+'/'+y);

和改变：

var end = $('#dataEnd').datepicker('getDate');

到：

var end = new Date($('#dataEnd').val());

jsFiddle example

来源

2014-12-03 16:46:02 j08691

宾果！我不知道“日期”可以设置没有datepicker。谢谢 – JackTheKnife 2014-12-03 16:52:34

是的，Date是一个原生的JS对象。 – j08691 2014-12-03 16:53:58

jQuery datepicker输入字段设置为“不可点击”

回答

相关问题