1

我试图弄清楚如何通过手动单击来配置多个 twitter 引导程序的弹出窗口。

但首先，一些代码：

# bootstrap.js.coffee
# this opens a popover with new server data
$('*[data-poload]').bind 'click', ->
  $this = $(this)
  $.get $this.data('poload'), (d) ->
    $this.popover
      content: d
      html: true
      title: $this.parents("tr").data("title")
    .popover 'show'

# this handles clicks everywhere on the page and decides what to do if it finds opened popovers
$("html").click (e) ->
  $('*[data-poload]').each ->
    $(this).popover "hide" if not ($(this).is(e.target) or $(this).has(e.target).length > 0) and $(this).siblings(".popover").length isnt 0 and $(this).siblings(".popover").has(e.target).length is 0

这是可弹出的链接。我在同一页面上有数百个具有不同 data-poload 属性的这些：

<a href="#" data-poload="/resources/some-id/popover">Text</a>

我的服务器将使用一些 html 响应/resources/some-id/popover弹出框正文中的此请求。

如果单击弹出框，我想发生什么：

  • 打开弹窗（服务器响应后）
  • 不要滚动到页面顶部
  • 如果我单击弹出框的主体，请不要关闭（那里有一些链接）
  • 关闭上一个弹出框（如果打开）

如果我点击其他任何地方：

  • 关闭上一个弹出框（如果打开）

问题：

  • 如果我单击弹出框，它将滚动到页面顶部（典型的点击传播）
  • 如果我重新单击相同的链接打开弹出框，该弹出框将被破坏并且无法再次打开它。它会在之后立即打开和关闭。

我试过return false这样

# bootstrap.js.coffee
$('*[data-poload]').bind 'click', ->
  $this = $(this)
  $.get $this.data('poload'), (d) ->
    $this.popover
      content: d
      html: true
      title: $this.parents("tr").data("title")
    .popover 'show'
  false

但这不起作用，因为下一个 js 位不会被触发。应该关闭其他弹出窗口的那个。单击其他任何地方当然可以。

4

0 回答 0