Question

我有一个div。在它的悬停我显示一个弹出窗口。我在popover中制作了两个按钮。问题是当我用鼠标按下按钮弹出消失。我动态制作div。我试过的是这个：

$('.more').click(function() {
         opinionBox += '<div onmouseenter="test($(this))" class="opinion">hello</div>';
         $(this).append(opinionBox);
})

对于popover：

function test(box) {
   box.popover({title: 'Current Opinion',
                trigger: 'hover', 
                html: 'true', 
                content: '<div><button>Press Me</button></div>', 
                placement: 'left'
              }).popover('show');
}

Answer 1

我建议你把 popover属性'延迟'（以毫秒为单位）：

function test(box) {
   box.popover({title: 'Current Opinion',
                trigger: 'hover', 
                delay: { hide: 5000 },  // or greater time as you think 
                html: 'true', 
                content: '<div><button>Press Me</button></div>', 
                placement: 'left'
              }).popover('show');
}

Answer 2

你曾经使用过'hover'事件，所以当你的鼠标不在时，pop将被删除。如果“点击”对您有用，那么您可以将触发事件用作“点击”。鼠标移出后，这不会删除div。

box.popover({title: 'Current Opinion',
            trigger: 'click',            // Changed event from hover to click
            html: 'true', 
            content: '<div><button>Press Me</button></div>', 
            placement: 'left'
          }).popover('show');

如何保持引导弹出窗口，以便用户可以单击其中的按钮

2 个答案: