Question

我的代码中有两个选择选项。第一个选择日期，第二个选择时间。我希望如果用户从选择选项1中选择今天的日期，则应禁用选择选项2中的某些时间选项。

对于前。如果用户选择今天的日期（15），则应禁用6.00.00时间。明天如果用户选择16，则应禁用6.00.00时间。这应该继续下去。

这是我的代码 -

<!DOCTYPE html>
<html>
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js">
</script>

</head>
<body>
<select name="time"  id = "put_time">
<option value="Select Time">Select Time</option>
<option value="6.00.00" id = "t1">6.00.00</option>
<option value="6.30.00" id = "t2">6.30.00</option>
<option value="7.00.00" id = "t3">7.00.00</option>
<option value="7.30.00" id = "t4">7.30.00</option> 
</select>
<select name="date" id = "put_date">
<option value="Select date" >Select Date</option>
<option value="11">11</option>
<option value="12">12</option>
<option value="13">13</option>
<option value="14">14</option>
<option value="15">15</option>
<option value="16">16</option>
<option value="17">17</option>
<option value="18">18</option>
<option value="19">19</option>
<option value="20">20</option>
</select>
<script>
var today = new Date();
if(document.getElementById('put_date') == today.getDate())
{
document.getElementById("t1").disabled = true;
}
else{ 
document.getElementById("t1").disabled = false;
};
</script>
</body>
</html>

但我没有得到理想的结果。有人请指导我如何实现这个目标？

感谢。

Answer 1

document.getElementById('put_date') == today.getDate()不是有效声明，您应该比较元素的value（document.getElementById('put_date').value）。我还在更改时调用函数，因为在init时，第二个select的值为空（不是真的为空，它等于"Select date"）：

function onChange() {
  var today = new Date();
  if (document.getElementById('put_date').value == today.getDate()) {
    document.getElementById("t1").disabled = true;
  } else { 
    document.getElementById("t1").disabled = false;
  }
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select name="time"  id = "put_time">
  <option value="Select Time">Select Time</option>
  <option value="6.00.00" id = "t1">6.00.00</option>
  <option value="6.30.00" id = "t2">6.30.00</option>
  <option value="7.00.00" id = "t3">7.00.00</option>
  <option value="7.30.00" id = "t4">7.30.00</option> 
</select>
<select name="date" id = "put_date" onchange="onChange()">
  <option value="Select date">Select Date</option>
  <option value="11">11</option>
  <option value="12">12</option>
  <option value="13">13</option>
  <option value="14">14</option>
  <option value="15">15</option>
  <option value="16">16</option>
  <option value="17">17</option>
  <option value="18">18</option>
  <option value="19">19</option>
  <option value="20">20</option>
</select>

Answer 2

你可以这样做。

$(document).ready(function(){
  $('#put_date').change(function(){
      var d = new Date();
      var n = d.getDate();
      if($(this).val() == n){
        $('#t1').prop('disabled',true);
      }
  })
})

根据变量值

2 个答案: