js LayUI 实现两个switch按钮联动一个开启则另一个关闭

本文链接：https://blog.csdn.net/sinat_38244712/article/details/95460430

界面样式：

HTML：

<script type="text/html" id="timeSearch">
    <input class="time" type="checkbox"  id="{{d.col}}_time" lay-filter="timeSearch" value="{{d.col}}" lay-skin="switch" lay-text="开启|关闭" {{d.timeSearch=='true'?'checked':''}} />
</script>

<script type="text/html" id="ordinarySearch">
    <input class="ordinary" type="checkbox" id="{{d.col}}_ordinary"  lay-filter="ordinarySearch" value="{{d.col}}" lay-skin="switch" lay-text="开启|关闭" {{d.ordinarySearch=='true'?'checked':''}} />
</script>

js实现：

//************************************************************//

框选的部分为重点！！！

//监听时间搜索框操作
    form.on('switch(timeSearch)', function (obj) {
//************************************************************//
        // 获取当前控件
        var selectIfKey = obj.othis;
        // 获取当前所在行
        var parentTr = selectIfKey.parents("tr");
//************************************************************//
        // 获取当前所在行的索引
        var col = this.value;
        // console.log(this.value + ' ' + this.name + '：'+ obj.elem, obj.othis);
        // layer.tips('查询框：'+ obj.elem.checked, obj.othis);
        var oldData = table.cache[searchTable.tableId];
        $.each(oldData, function (i, n) {
            if (col === n.col) {
                if (obj.elem.checked) {
                    //判断普通搜索框是否为选中状态，如果是则改为否
                    if (n.ordinarySearch) {
                        // $("#"+n.col+"_ordinary").removeAttr('checked');
                        //************************************************************//
                        var switchIfNull = $($($(parentTr).find("td")[2]).find("input")[0]);
                        $(switchIfNull).removeAttr('checked');
                       //************************************************************//
                        n.ordinarySearch = false;
                        form.render();
                    }
                    n.timeSearch = true;
                } else {
                    n.timeSearch = false;
                }
            }
        });

    });

    //监听普通搜索框操作
    form.on('switch(ordinarySearch)', function (obj) {
        var col = this.value;
        // 获取当前控件
        var selectIfKey = obj.othis;
        // 获取当前所在行
        var parentTr = selectIfKey.parents("tr");
        var oldData = table.cache[searchTable.tableId];
        $.each(oldData, function (i, n) {
            if (col === n.col) {
                if (obj.elem.checked) {
                    //判断时间搜索框是否为选中状态，如果是则改为否
                    if (n.timeSearch) {
                        var switchIfNull = $($($(parentTr).find("td")[1]).find("input")[0]);
                        $(switchIfNull).removeAttr('checked');
                        n.timeSearch = false;
                        form.render();
                    }
                    n.ordinarySearch = true;
                } else {
                    n.ordinarySearch = false;
                }
            }
        });

    });