我使用jquery bootstrap下拉菜单。我在下拉列表中添加了一些输入文本,现在当我尝试提交时,我想要做的,它必须关闭下拉列表。这是任何方式吗?
这里是来自twitter bootstrap的url演示:
http://twitter.github.com/bootstrap/javascript.html#dropdowns
!function ($) { var toggle = '[data-toggle=dropdown]',Dropdown = function (element) { var $el = $(element).on('click.dropdown.data-api',this.toggle) $('html').on('click.dropdown.data-api',function () { $el.parent().removeClass('open') }) } Dropdown.prototype = { constructor: Dropdown,toggle: function (e) { var $this = $(this),$parent,isActive if ($this.is('.disabled,:disabled')) return $parent = getParent($this) isActive = $parent.hasClass('open') clearMenus() if (!isActive) { $parent.toggleClass('open') $this.focus() } return false },keydown: function (e) { var $this,$items,$active,isActive,index if (!/(38|40|27)/.test(e.keyCode)) return $this = $(this) e.preventDefault() e.stopPropagation() if ($this.is('.disabled,:disabled')) return $parent = getParent($this) isActive = $parent.hasClass('open') if (!isActive || (isActive && e.keyCode == 27)) return $this.click() $items = $('[role=menu] li:not(.divider) a',$parent) if (!$items.length) return index = $items.index($items.filter(':focus')) if (e.keyCode == 38 && index > 0) index-- // up if (e.keyCode == 40 && index < $items.length - 1) index++ // down if (!~index) index = 0 $items .eq(index) .focus() } } function clearMenus() { getParent($(toggle)) .removeClass('open') } function getParent($this) { var selector = $this.attr('data-target'),$parent if (!selector) { selector = $this.attr('href') selector = selector && /#/.test(selector) && selector.replace(/.*(?=#[^\s]*$)/,'') //strip for ie7 } $parent = $(selector) $parent.length || ($parent = $this.parent()) return $parent } $.fn.dropdown = function (option) { return this.each(function () { var $this = $(this),data = $this.data('dropdown') if (!data) $this.data('dropdown',(data = new Dropdown(this))) if (typeof option == 'string') data[option].call($this) }) } $.fn.dropdown.Constructor = Dropdown $(function () { $('html') .on('click.dropdown.data-api touchstart.dropdown.data-api',clearMenus) $('body') .on('click.dropdown touchstart.dropdown.data-api','.dropdown form',function (e) { e.stopPropagation() }) .on('click.dropdown.data-api touchstart.dropdown.data-api',toggle,Dropdown.prototype.toggle) .on('keydown.dropdown.data-api touchstart.dropdown.data-api',toggle + ',[role=menu]',Dropdown.prototype.keydown) }) }(window.jQuery);
解决方法
自举模式
尝试$(‘#myModal’)。modal(‘hide’)
用于引导popover
我只是看到你正在谈论一个bootstrap dropdown不bootstrap模态:
在这种情况下,你的方法不错,只是删除父元素的打开类。
在来自上面的链接的示例中,第一下拉元素具有“drop3”的id,
所以编程关闭它可以:
$('#drop3').parent().removeClass("open");