【发布时间】:2016-12-06 20:04:01
【问题描述】:
我肯定做错了,但必须有一种方法来简化这个过程。我有一个包含 4 个表单的模式,除了一个具有“活动”类的表单外,所有表单都是隐藏的。我需要根据来自不同按钮的点击事件触发每个单独的表单,即。注册/忘记密码/登录等,所以当我单击注册按钮时,模式会出现并激活注册表单,单击忘记密码只是切换表单以显示忘记密码。等等。
我的想法是创造:
function modalSwitch() {
var btnModal = [$('btn-one'),$('btn-two'),$('btn-three'), $('btn-four')];
var formModal = [$('form-one'),$('form-two'),$('form-three'), $('btn-four')];
btnModal.click(function(){
if ( btnModal[].attr('class') === formModal[].attr('data-id')) {
formModal.addClass('active');
}
});
}
modalSwitch();
而不是点击事件:
function modalSwitch() {
var btnOne = $('.btn-one');
var btnTwo = $('.btn-two');
var btnThree = $('.btn-three');
var btnFour = $('.btn-four');
var btnFive = $('.btn-five');
var btnSix = $('.btn-six');
var modalOne = $('.modal-one');
var modalTwo = $('.modal-two');
var modalThree = $('.modal-three');
var modalFour = $('.modal-four');
var modalFive = $('.modal-five');
var modalSix = $('.modal-six');
btnOne.click(function(){
modalOne.addClass('show');
modalTwo.removeClass('show');
modalThree.removeClass('show');
modalFour.removeClass('show');
modalFive.removeClass('show');
modalSix.removeClass('show');
....
});
}
modalSwitch();
但我现在很迷茫,任何帮助将不胜感激
【问题讨论】:
-
btnModal和formModal应该是 jQuery 变量;它们目前是普通数组。例如,您可以使用$('.btn-one, .btn-two, .btn-three, .btn-four')选择多个按钮。 -
不知道你在这里想说什么,这不是解决方案......
标签: javascript bootstrap-modal