Question

我有复选框和已禁用的文本框。如果复选框为true，则文本框将处于活动状态且已聚焦。如果为false，则会被禁用。我在文本框中添加了模糊事件，并为某些操作选中了复选框更改事件。

dateArr

脚本

<input type="checkbox" id="chkTest1" name="chkTest1" value="Bike"> check</br>
<input type="text" id="txtTest1" disabled  />

我的问题是

当复选框变为false时，禁用文本框并失去焦点。因此，将触发复选框更改事件和模糊事件。但在模糊事件中，复选框值仍为true而不是false。如何解决这个问题。

此处代码Fiddle

提前致谢。

Answer 1

在填写字段后直接单击复选框时，您需要等待，因为模糊在更改复选框的单击之前触发。另请注意，.off()将在单击！

后从文本字段中删除模糊处理程序

＆＃13;

$(function() {
  $('#chkTest1').on("click", function() {
    var flagCheck = this.checked;
    $('#txtTest1').prop('disabled', !flagCheck).val('');
    if (flagCheck) {
      $('#txtTest1').focus();
    }
  });

  $("#txtTest1").on("blur", function() {
    setTimeout(function() { console.log("test check",$("#chkTest1").is(':checked')); },500);
  });
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<input type="checkbox" id="chkTest1" name="chkTest1" value="Bike">check</br>
<input type="text" id="txtTest1" disabled />

＆＃13;

Answer 2

@Glitson George:

     i explaned why i am removing
 the blur event in the below fiddle. Please check jsfiddle.net/ka1mkfrv/6 .
    once blur function stored in memory,
 2nd time onwards  blur function will excute first  then change event will excute

 Please check the console for this.

http://jsfiddle.net/ka1mkfrv/6/

Answer 3

我想您在禁用复选框时要保留文本框内容：

$('#chkTest1').change(function() {
  var flagCheck = $(this).prop('checked');

  if(flagCheck)
  {
    $('#txtTest1').prop('disabled', !flagCheck).val('').off();
    $('#txtTest1').focus();  
  } else {
    $('#txtTest1').prop('disabled', !flagCheck);
  }    
  $('#txtTest1').blur(function () {                
    console.log($("#chkTest1").prop('checked'));                
  });  
});

http://jsfiddle.net/ka1mkfrv/4/

Answer 4

以下代码仅在文本框未禁用

时执行

$('#txtTest1').blur(function () {                
    console.log($("#chkTest1").prop('checked'));                
});

因此，当您的文本框同时启用时，您的复选框也会启用。

当您的文本框同时被禁用时，您的复选框也将被禁用，但您的上述内容将不会被执行。

这就是为什么你不能打印复选框的错误值

Answer 5

下面是工作小提琴

$(document).on("change",'#chkTest1',function() {
 var flagCheck = $(this).is(':checked')
  if(flagCheck){
    $('#txtTest1').removeAttr('disabled').val('').off();
     $('#txtTest1').focus();  
    }
    else
    {
    $('#txtTest1').prop('disabled', !flagCheck).val('');
    console.log($("#chkTest1").is(':checked')); 
   }

});

http://jsfiddle.net/ka1mkfrv/5/

复选框值显示错误

5 个答案: