JQ设置input disabled

最新推荐文章于 2023-08-10 09:24:51 发布

原创最新推荐文章于 2023-08-10 09:24:51 发布 · 1.7k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#js #input #disabled #attr

本文介绍如何使用layui框架实现表单元素间的联动功能，具体为当用户在下拉选择框中选择特定选项时，下方输入框的状态将根据所选值进行动态切换。如果选择不限，输入框将变为不可编辑状态并显示灰色背景；否则，输入框恢复可编辑状态并显示白色背景。

代码：

layui.use('form', function () {
    var form = layui.form;
    form.render();

    form.on('select(selectTyp)', function (data) {
        $("#input_val").val("");
        var selectTyp = data.value;//得到被选中的值
        if (selectTyp == 0) {//如果为不限，输入框置灰
            $('#input_val').attr('disabled', true).css("background-color","#e6e6e6");
        } else {
            $("#input_val").removeAttr("disabled").css("background-color","#fff");
        }
    })
});