带有切换的bootstrap 4,超出了最大调用堆栈大小

问题描述 投票:0回答:1

我在asp.net工作。 Bootstrap 4,Jquery 3.3.1尝试使用bootstrap4-toggle。我有3个输入,每个输入都有自己的特定ID。在加载时,第一个切换开启。每当更改复选框时,我都会触发一个on change事件。在这个变化事件中,如果我这样做:

$("#chk15849").bootstrapToggle('off');
// or 
$("#chk15849").prop('checked', false).change();

我收到一个错误告诉我

未捕获RangeError:超出最大调用堆栈大小。

查看如何执行此操作,看起来我正确地做到了..但是因为我明显得到了错误,所以我不是。这是一些示例代码

这是我正在做的事情的小提琴。 http://jsfiddle.net/4x5r09fv/

$('[type=checkbox]').change(function() {
  $("#chk15849").bootstrapToggle('off');
  //$("#chk15849").prop('checked', false).change();
})
})

这两个例子都会导致Uncaught Range Error

这是我开始简单的工作到一个更复杂的页面。但就目前而言,我需要弄明白这一点。

当你运行小提琴时,你会看到在加载时第一个切换开启了。单击第二个切换时,将触发更改事件并关闭第一个切换。这是在Chrome的开发工具中出现错误的时候。

任何帮助都会很棒。

- 附加信息。

Aswin Kumar提供了一个解决方案。但建立在他所说的基础之上。如果这更具动态性怎么办?因此,如果切换次数发生变化,我们希望所有切换都关闭,除了打开的切换次数。怎么做我找到了这段代码

  $(".toggle").change(function () {
            if ($(this).is(":checked")) {
                $('[id^="toggle"]').not(this).each(function () {
                    $(this).bootstrapToggle('off');
                });
            }
        });

但是,此代码与我的代码相同,并且还提供“未捕获的RangeError:超出最大调用堆栈大小”。再一次,我不知道如何更改代码,以便它不会给出错误并允许切换除一个以外的所有代码。

jquery bootstrap-4 toggle
1个回答
0
投票

我想我想出来了。首先,因为我在asp.net工作,我希望能够从代码中获取复选框的状态。因此,在数据驱动列表视图中创建的复选框使复选框看起来像这样。

<input id="test" type="checkbox" data-toggle="toggle" runat="server" data-on="It's <br/> Working" data-off="Not Ready" data-onstyle="success" data-offstyle="danger">

要处理只在javascript中选中一个复选框的切换,看起来像这样

$(document).ready(function () {
       $("#ListDiv [type=checkbox]").change(function () {
            console.log("first if");
            if ($(this).is(":checked")) {
                console.log("second if");
                $("#ListDiv [type=checkbox]").not(this).each(function () {
                    console.log("third one");
                    $(this).bootstrapToggle('off');
                });
            }
        });
    });

ListDiv是listview周围的div的名称。它使得切换仅影响div标签内的复选框。至于后面的代码去看看复选框的状态是什么......用它来处理

  For Each i As ListViewItem In Me.lvClassIndex.Items
        CType(i.FindControl("lbl"), Label).Text = CType(i.FindControl("test"), HtmlInputCheckBox).Checked.ToString
    Next

这是一个测试页面,所以我在每行中取复选框的值,并将结果放在同一行的标签中。但它的效果非常好。如果有超过100行返回它开始有点慢,但这适用于我所追求的。

© www.soinside.com 2019 - 2024. All rights reserved.