自定义冗余复选框输入Jquery代码

Customize redundant Checkbox input Jquery Code

本文关键字：Jquery 代码 输入 复选框 冗余 自定义      更新时间：2023-09-26

我有下面的工作代码，我认为他有点太长和多余了，我可以自定义它吗？

$( "#unique" ).click(function() {
    if ( $( this ).is(':checked') ) {
        $( ".lotud" ).show();
        $( "#add_lot" ).hide();
        $( "#lots_rows_contnr" ).hide();
        $(".lotud input").prop({disabled: false})
        $("#lots_rows_contnr input").prop({disabled: true})
    }
    else {
        $( ".lotud" ).hide();
        $( "#add_lot" ).show();
        $( "#lots_rows_contnr" ).show();
        $(".lotud input").prop({disabled: true})
        $("#lots_rows_contnr input").prop({disabled: false})
    }
});

您可以通过使用ternaries、使用DOMElement本身的checked属性、连接选择器以及使用checked属性作为disabled属性的基础来稍微缩短它。试试这个：

$("#unique").click(function() {
    $(".lotud").toggle(this.checked);
    $("#add_lot, #lots_rows_contnr").toggle(!this.checked);
    $(".lotud input").prop({ disabled: !this.checked });
    $("#lots_rows_contnr input").prop({ disabled: this.checked });
});

这两个版本中，你的原版还是上面的版本，可读性更强，这是一个意见问题。

相关文章：