Question

我想在我的引导网站中选择文本时出现一个自动弹出菜单。单击链接时我的代码可以正常工作。我希望它在选择文本时有效。

<!DOCTYPE html>
<html lang="en">
<head>
  <title>Bootstrap Example</title>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
</head>
<body>

<div class="container">
  <h3>Popover Example</h3>
  <a href="#" data-toggle="popover" title="Popover Header" data-content="Some content inside the popover">Toggle popover</a>
</div>

<script>
$(document).ready(function(){
    $('[data-toggle="popover"]').popover();   
});
</script>

</body>
</html>

感谢

Answer 1

你必须触发“悬停”。选中 fiddle

 $('[data-toggle="popover"]').popover({ trigger: "hover" });

Answer 2

＆＃13;

 $("#myDiv").mousedown(function(){
    
              $("#myDiv").mouseup(function(){
    
                         $("#myPopUp").show();
              });
    });

＆＃13;

#myPopUp
{
    display:none;
    position: absolute;
    width: 200px;
    min-width: 200px;
    max-width: 300px;
    background: #FFF;
    border: #D7D7D7 1px solid;
    -moz-box-shadow: rgba(0, 0, 0, 0.3) 0px 10px 15px;
    -khtml-box-shadow: rgba(0, 0, 0, 0.3) 0px 10px 15px;
    box-shadow: rgba(0, 0, 0, 0.3) 0px 10px 15px;
    -moz-border-radius: 5px;
    -khtml-border-radius: 5px;
    border-radius: 5px;
    overflow: hidden;
    z-index: 10000;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="myDiv">
    hello
</div>
<div id="myPopUp">
    <div class="textassist" style="top: 239px; left: 874px; display: block;"><ul><li><a><span><span style="height:30px" class="btn comment fa fa-anchor icon-ezhare-nazar"></span>a</span></a></li><li><a><span><span style="height:30px" class=" btn  fa fa-anchor icon-porsesh1"></span>b</span></a></li>
</div>

＆＃13;

如何在bootstrap中选择文本时打开弹出菜单？

2 个答案: