this.$backdrop = $('<div class="modal-backdrop ' + animate + '" />')
.appendTo(document.body)
- this.$backdrop.click(
- this.options.backdrop == 'static' ?
- $.proxy(this.$element[0].focus, this.$element[0])
- : $.proxy(this.hide, this)
- )
+ this.$element.on('click', $.proxy(function (e) {
+ if (e.target !== e.currentTarget) return
+ this.options.backdrop == 'static'
+ ? this.$element[0].focus.call(this.$element[0])
+ : this.hide.call(this)
+ }, this))
if (doAnimate) this.$backdrop[0].offsetWidth // force reflow
})
.modal("show")
})
+
+ test("should close modal when clicking outside of modal-content", function () {
+ stop()
+ $.support.transition = false
+ var div = $("<div id='modal-test'><div class='contents'></div></div>")
+ div
+ .bind("shown.bs.modal", function () {
+ ok($('#modal-test').length, 'modal insterted into dom')
+ $('.contents').click()
+ ok($('#modal-test').is(":visible"), 'modal visible')
+ $('#modal-test').click()
+ })
+ .bind("hidden.bs.modal", function() {
+ ok(!$('#modal-test').is(":visible"), 'modal hidden')
+ div.remove()
+ start()
+ })
+ .modal("show")
+ })
})