如何解决Bootstrap 弹出框只显示一次
我使用 jquery
在 html 中实现了 popover。
但是,如果弹出框显示然后消失,则不会再次显示相同的弹出框。
我也试过 css.("display","none")
,但没用。
在这个问题上被困了 3 天。请给我一个解决方案
下面是我写的代码。
jquery:
$(document).ready(function() {
$(document).on('click','.btn-danger',function() {
var $this = $(this);
var checkBtn = $(this);
selected_line = checkBtn.text().substring(11) * 1;
selected_td = checkBtn.parent();
console.log(checkBtn.text())
$(selected_td.children('#popover'+selected_line)).popover({
trigger : 'click',placement : 'right',html : true,content : function() {
var pop = selected_td.children('#advice_line'+selected_line);
pop.show();
return pop
},container : 'body'
});
//attach link text
$('.popover-textarea').val($this.text()).focus();
//hide any visible comment-popover
$(selected_td.children('#popover'+selected_line)).not(this).popover('hide');
var $this = $(this);
//close on cancel
$(selected_td.find('#popover_cancel'+selected_line)).click(function() {
//$this.popover('dispose')
$('#popover'+selected_line).popover('dispose')
});
//update link text on submit
$(selected_td.find('#popover_submit'+selected_line)).click(function() {
$this.text($('.popover-textarea').val());
$this.popover('dispose');
});
});
});
HTML:
<a id="<%= 'popover'+i %>" data-html="true" href="#" data-toggle="tooltip" rel="comments"
class="btn btn-danger"><%= 'advice_line'+i %></a>
<div class="popover" style="display: none;" id="<%= 'advice_line'+i %>">
<div class="popover-arrow"></div><h3 class="popover-header">Advice</h3>
<div class="popover-body"><div class="popover-content"><textarea class="popover-textarea"><%= 'advice_line'+i %></textarea></div></div>
<div class="popover-footer">
<button id="<%= 'popover_submit'+i %>" type="button" class="btn btn-primary">submit</button>
<button id="<%= 'popover_cancel'+i %>" type="button" class="btn btn-default">cancel</button>
</div>
</div>
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。