取消选中时,在输入字段中设置特定值

时间:2017-06-09 13:53:29

标签: javascript jquery checkbox

我们有桌面输入以获得早晨&用户的晚上时间。

如果用户必须输入早晨时间,则必须选中该复选框。如果它没有被检查,它就会模糊不清,而且无法填补它的价值。

取消选中时,默认值为time1& time2应该是" 00:00"。

晚上的时间也一样。

请建议如何操作。



<table border="1"">
  <tr>
    <th colspan="3">User Timing</th>
  </tr>
  <tr>
    <td>Morning</td>
    <td><input name="morning" type="checkbox" id="set_val1" value="1"></td>
    <td><input type="time" name="time1" min="" class="timing" value="<?php echo $time1; ?>" placeholder="" required>
    to
    <input type="time" name="time2" min="" class="timing" value="<?php echo $time2; ?>" placeholder="" required>
    </td>
  </tr>
  <tr>
    <td>Evening</td>
    <td><input name="evening" type="checkbox" id="set_val2" value="00:00"></td>
    <td><input type="time" name="time3" min="" class="timing" value="<?php echo $time3; ?>" placeholder="" required>
    to
    <input type="time" name="time4" min="" class="timing" value="<?php echo $time4; ?>" placeholder=""required></td>
  </tr>
</table>
&#13;
&#13;
&#13;

1 个答案:

答案 0 :(得分:1)

&#13;
&#13;
$(".timing1").prop( "disabled", true); 
$(".timing2").prop( "disabled", true); 
$("#set_val1").click(function(){

  if($(this).prop("checked")==true)
  {
    $(".timing1").prop( "disabled", false); 
  }
  else{
    $(".timing1").prop( "disabled", true); 
  }

});

$("#set_val2").click(function(){

  if($(this).prop("checked")==true)
  {
    $(".timing2").prop( "disabled", false); 
  }
  else{
    $(".timing2").prop( "disabled", true); 
  }

});
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table border="1"">
  <tr>
    <th colspan="3">User Timing</th>
  </tr>
  <tr>
    <td>Morning</td>
    <td><input name="morning" type="checkbox" id="set_val1" value="1"></td>
    <td><input type="time" name="time1" min="" class="timing1" value="00:00" placeholder="" required>
      to
    <input type="time" name="time2" min="" class="timing1" value="00:00" placeholder="" required >
    </td>
  </tr>
  <tr>
    <td>Evening</td>
    <td><input name="evening" type="checkbox" id="set_val2" value="00:00"></td>
    <td><input type="time" name="time3" min="" class="timing2" value="00:00" placeholder="" required>
      to
    <input type="time" name="time4" min="" class="timing2" value="00:00" placeholder=""required></td>
  </tr>

</table>
&#13;
&#13;
&#13;