如果我在输入类型文本中写入内容,请选中复选框

Question

我正在尝试制作一个看起来像这样的表单:

如果在输入类型="text"内部是一个像数字自动检查CHECKBOX,是jquery？或简单的PHP.

啊,更重要的是,我正在使用woocommerce,所以我做了这样的功能.

add_action('woocommerce_after_order_notes', 'my_custom_checkout_field');


function my_custom_checkout_field( $checkout ) {




    woocommerce_form_field( 'losung', array( 
        'type'          => 'text', 
        'class'         => array('my-field-class'), 

        'label'         => __('titel'), 
        'placeholder'   => __('Enter a number'),
        ), $checkout->get_value( 'my_field_name' ));
        echo '<div class="spiele-container">';
        echo '<input class="input-checkbox pull-left" id="" type="checkbox" name="ter">';
        echo '<div id="text-container-spiele">text ';
    echo '</div>';
    echo '</div>';

}

Answer 1

你可以这样做:

HTML:

<input type="text" class="something" />
<br>  
<input type="checkbox" name="check" class="check">

JS:

$("input[type='text']").on("keyup", function(){
    if(this.value!=""){
        $("input[type='checkbox']").prop("checked", "checked");
    }else{
        $("input[type='checkbox']").prop('checked', ""); 
    }
});

演示:http://jsbin.com/anANoSof/1/

更清洁的解决方案是使用类/ id作为文本字段以及复选框,并使用如下:

HTML:

<input type="text" class="num" />
<br>  
<input type="checkbox" name="check" class="check">

JS:

$(".num").on("keyup", function(e){
    if(this.value!=""){
        $(".check").prop("checked", "checked");
    }else{
        $(".check").prop('checked', ""); 
    }
});

演示:http://jsbin.com/iWESuTa/1/

根据@Fred,要禁止用户手动单击复选框,只需使用以下disabled属性:

 <input type="checkbox" disabled name="check" class="check">

演示:http://jsbin.com/iWESuTa/2/