загрузчик 4 с переключателем, дающим максимальный размер стека вызовов превышен

Question

Я работаю в asp.net.Bootstrap 4, Jquery 3.3.1 пытается использовать переключатель bootstrap4.У меня есть 3 входа, каждый со своим собственным идентификатором.При нагрузке включается первый тумблер.У меня есть событие при изменении, которое срабатывает всякий раз, когда меняется флажок.В этом событии изменения, если я либо:

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

, я получаю сообщение об ошибке

Uncaught RangeError: Превышен максимальный размер стека вызовов.

Посмотрев, как выполнить это действие, похоже, я делаю это правильно ... но, поскольку я получаю сообщение об ошибке, по-видимому, нет.Вот пример кода

Вот скрипка того, что я делаю.http://jsfiddle.net/4x5r09fv/

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

Оба этих примера приводят к ошибке Uncaught Range

Это я начинаю с простой работы над более сложной страницей.Но сейчас мне нужно выяснить это.

Когда вы запустите скрипку, вы увидите, что при загрузке включен первый переключатель.При нажатии на второй переключатель происходит изменение события, и первый переключатель отключается.Это когда ошибка происходит в инструментах разработчика Chrome.

Любая помощь будет отличной.

- Дополнительная информация.

Асвин Кумар предоставил решение.Но опираясь на то, что он сказал.Что делать, если это более динамично?Так что, если количество переключателей меняется, и мы хотим, чтобы все переключатели были выключены, кроме включенного.Как это сделано?Я нашел этот код

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

Однако этот код начинается так же, как у меня, и также выдает «Uncaught RangeError: Превышен максимальный размер стека вызовов».Еще раз, я не уверен, как изменить код, чтобы он не выдавал ошибку и допускал переключение всех, кроме одного.

Answer 1

Я думаю, я понял это.Во-первых, так как я работаю в 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 - это имя моего 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 строк, он начинает работать немного медленнее, но это хорошо работает для того, что я преследовал.