我正在尝试使用 popover
但问题是关闭按钮在 data-content
中不起作用,我已经尝试将其放入 title
并且工作正常,但我真的需要把它放在 data-content
中 :)
谢谢大家...
$(function () {
$('[data-toggle="popover"]').popover();
});
.btn {
margin:80px
}
body {
background: #f5f5f5
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<!-- Latest compiled and minified JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
<button class="btn btn-success btn-edit"
data-toggle="popover"
data-html='true' data-placement="bottom"
data-content='<button type="button" id="close" class="close" onclick="$(".btn-edit").popover("hide");">×</button>'>
CLICK ME
</button>
最佳答案
HTML 实体 ("
) 不会在 JavaScript 表达式中被解析,这就是你在 onlick
属性中所拥有的。但是您可以使用反引号代替单引号。即:
<button data-content='<button onclick="$(`.btn-edit`).popover(`hide`);">...</button>'>
$(function () {
$('[data-toggle="popover"]').popover();
});
.btn {
margin:80px
}
body {
background: #f5f5f5
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<!-- Latest compiled and minified JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
<button class="btn btn-success btn-edit"
data-toggle="popover"
data-html='true' data-placement="bottom"
data-content='<button type="button" id="close" class="close" onclick="$(`.btn-edit`).popover(`hide`);">×</button>'>
CLICK ME
</button>
关于javascript - bootstrap Popover 关闭按钮不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/49287387/