Question

我想在jquery中创建一个函数，如果输入文本框有内容，请选中复选框。如果为空，请取消选中该复选框。

<form>
<input class="boxcheck" type="checkbox">
checkbox

<input class="boxtext" type="text">
text here 
</form>

复选框和文本输入将在开头为空，但如果用户决定在文本框中写入内容，则应自动检查该复选框是否已由用户检查。

另一个问题可能是用户会输入内容，此功能会检查复选框，但如果用户返回输入框并删除输入框中的内容，则也应自动取消选中该复选框。 / p>

我能想到的最后一个问题是，如果用户在文本框中写入内容，并且此函数检查复选框，但用户出于某种奇怪的原因取消选中该框，是否可以再次强制选中该复选框？ / p>

我一直在玩keyup和prop触发器，但我绝对没有运气。我也是JavaScript的新手。

我一直在玩的代码是：

    $('input[text]').keyup(function(){
    if (this.value.length > 0) {
       $('input[name="checkbox"]').prop('disabled', false)
    } else {
})

Answer 1

使用keyup()函数检查val和条件以选中取消选中该复选框这个

 $(".boxtext").keyup(function(){
   if($(this).val()!= ""){
     $('.boxcheck').prop('checked',true);
   }else{
     $('.boxcheck').prop('checked',false);
   }
})

<强>更新

以及您的上一个问题..我认为如果您禁用复选框会更好..这样用户将无法取消选中...

 $('.boxcheck').prop('disabled',true);

updated fiddle

Answer 2

除了keyup之外，我建议处理模糊事件，因为它涵盖了用户在没有键盘的情况下更改文本框值的任何情况（复制/剪切/粘贴/拖动'n'drops /等），而不需要担心哪些浏览器允许或不允许您处理剪贴板事件：

$(document).ready(function() {
    $("input.boxtext").on("keyup blur", function() {
        $("input.boxcheck").prop("checked", this.value != "");
    });

    // don't allow user to manually change the checkbox
    $("input.boxcheck").click(function() {
        return false;
    });
});

演示：http://jsfiddle.net/WTVEn/

请注意，虽然我已经包含了阻止用户更改复选框的代码，但如果无法手动编辑，为什么还需要复选框呢？

Answer 3

试试这个：

 $(".boxtext").change(function(){
   $('.boxcheck').attr('checked',true);
   if($(this).val()== ""){
     $('.boxcheck').attr('checked',false);
   }
});

如果输入框有内容，请选中复选框

3 个答案: