我有一个表单,它跨越了几个开箱即用的Bootstrap Collapse窗格。它们在鼠标点击时正确地切换--现在我想实现一种方法,通过从当前打开的窗格的最后一个输入跳格时触发的任何事件来打开一个关闭的窗格。
IOW,当我在打开的窗格的输入字段中移动时,我可以从一个输入跳到下一个输入--当我从最后一个输入跳到下一个窗格的标题区域时,我希望跳到该标题区域的动作触发.collapse('toggle')
;
我已经尝试了几个变化:
$('#collapseAcct').focus(function () {
$('#collapseAcct').collapse('toggle');
});
我也尝试过用:parent
来爬家族树,但是没有找到关键字。我的窗格结构:我使用3个窗格,其中唯一标识符是div结构中的一层嵌套--与BS的文档几乎相同。例如,1个窗格的struc:
<div class="accordion-group">
<div class="accordion-heading">
<a class="accordion-toggle" data-toggle="collapse" data-parent="#createUserPanes" href="#collapseAcct">Account</a>
</div>
<div id="collapseAcct" class="accordion-body collapse">
<div class="accordion-inner">
<div>content</div>[and everything wraps out accordingly]
4条答案
按热度按时间au9on6nz1#
如果反过来做,在当前折叠式面板中的最后一个输入模糊时打开下一个折叠式面板,会怎样:
当然,您确实为所有元素提供了唯一ID,而不是所有
collapseAcct
oprakyz72#
我有一个情况,需要使引导面板的行为像一个窗体,所以打开焦点或鼠标悬停。
我刚刚触发了click事件。
密码:
ep6jt1vc3#
这应该可以帮助您开始:http://jsfiddle.net/Xbg4n/45/
这个例子没有使用.collapse,只使用了.slideUp和. slideDown......应该很容易用collapse替换掉,但是对于例子来说是有效的。你真正得到的是定位,我想这也是你主要问的问题。我还在这里添加了一些循环回到第一个容器,但是在那里停止了。你应该添加更好的焦点控制(避免焦点在锚标记上,并在循环回第一个容器时强制焦点)。
您没有提供完整的HTML示例代码,所以我在空白处进行了填充:
JS:
});
CSS:
f0brbegy4#
您可以使用bootstrap collapse events
呼叫show instance方法时,会立即引发这个事件。
当折叠元素对用户可见时激发此事件(将等待CSS过渡完成)。
呼叫hide方法后,会立即引发这个事件。
此事件在折叠元素对用户隐藏时触发(将等待CSS过渡完成)。Copy
例如: