Bootstrap 3: работа JS во всех табах

420
06 февраля 2017, 18:04

Здравствуйте.

Есть шаблон на Bootstrap 3, в котором реализованы вкладки (tab). Есть три вкладки, в каждой находится форма с JS-калькулятором чекбоксов. Проблема в том, что калькулятор работает в первой вкладке, но не работает в других. В чем может быть проблема?

Скрипт калькулятора подключен перед закрывающим тегом боди.

Скрипт:

var Calculator = {
selectedGroups: [],
sum: 0,
isGroupSelected: function(groupId) {
    return this.selectedGroups.indexOf(groupId) != -1;
},
addSelected: function(groupId, amount) {
    if (!this.isGroupSelected(groupId)) {
        this.changeSum(amount);
    }
    this.selectedGroups.push(groupId);
},
removeSelected: function(groupId, amount) {
    if (!this.isGroupSelected(groupId)) {
        return;
    }
    var groupIndex = this.selectedGroups.indexOf(groupId);
    this.selectedGroups.splice(groupIndex, 1);
    if (!this.isGroupSelected(groupId)) {
        this.changeSum(-amount);
    }
},
onSelect: function(groupId, amount, elem) {
    if (elem.checked) {
        this.addSelected(groupId, amount);
    } else {
        this.removeSelected(groupId, amount);
    }
},
changeSum: function(amount) {
    this.sum += amount;
    this.showSum();
},
showSum: function() {
    document.getElementById ('r').innerHTML = this.sum;
    document.getElementById('def_sum').value = document.getElementById('r').innerHTML;
}
}

Часть формы

<input type="checkbox" name="option[]" onclick="Calculator.onSelect(1, 10, this)" value="Чекбокс 1" />Чекбокс 1
<input type="checkbox" name="option[]" onclick="Calculator.onSelect(2, 10, this)" value="Чекбокс 2" />Чекбокс 2
<input type="checkbox" name="option[]" onclick="Calculator.onSelect(3, 10, this)" value="Чекбокс 3" />Чекбокс 3

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

READ ALSO
Проблема с плагином easyzoom.js

Проблема с плагином easyzoom.js

Использую плагин easyzoomjs для изображений, но требуется он только для ПК, а для моб

451
Некорректно срабатывает js (jquery) script

Некорректно срабатывает js (jquery) script

Есть скрипт, который при наведении на элемент меню должен менять класс у блока с подкатегориями

392
Вызов Java Script без клика

Вызов Java Script без клика

Есть код всплывающей подсказки notification, показ через onclick

429