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

 miedao1592_460 发布于 2023-01-29 17:06

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

如果在输入类型="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 '
'; echo ''; echo '
text '; echo '
'; echo '
'; }

Roy M J.. 5

你可以这样做:

HTML:



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:



JS:

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

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

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

 

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

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/

    2023-01-29 17:08 回答
撰写答案
今天,你开发时遇到什么问题呢?
立即提问
热门标签
PHP1.CN | 中国最专业的PHP中文社区 | PNG素材下载 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有