Question

我有一个Bootstrap弹出窗口，显示“删除”按钮操作：

<a href="#" class='dd' rel="popover" data-content="<a href='#' class='removeNote btn' data-id='{{$note->id}}'  >Remove</a>" data-original-title="Remove Note?"><i class='icon-remove'></i></a>

我希望删除操作“removeNote”来调用remove jQuery代码块，但事实并非如此。如果我删除弹出代码，它工作正常。有任何想法吗？

$(".removeNote").click(function() {

var id = $(this).data("id");

$.ajax({
    type: 'DELETE',
    url: '/note/' + id,
    data: {
        'id': id
    },
    success: function(msg) {

     $(".note" + id ).fadeOut(500);
     $(".poster" + id ).fadeOut(500);
 }
 });

 });

Answer 1

我认为如果用简单的引号替换双引号，反之亦然。像这样：

<a href="#" class='dd' rel="popover" data-content='<a href="#" class="removeNote btn" data-id="{{$note->id}}">Remove</a>' data-original-title="Remove Note?"><i class='icon-remove'></i></a>

但我会将我的链接放入标记而不是某些数据标记。这就是它的工作方式：

Popover JS代码：

$("[data-rel=popover]").popover({ 
    html : true,
    title: function() {
      return $("#popover-head").html();
    },
    content: function() {
      return $("#popover-content").html();
    }
});

Popover HTML Markup：

<a href="#" id="popover">the popover link</a>
<!-- popover content: Header and content -->
<div id="popover-head" class="hide">Remove Note</div>
<div id="popover-content" class="hide">
<a href="#" class="removeNote btn" data-id="{{$note->id}}">Remove</a>
</div>

如何使用Bootstrap PopOver和jQuery删除项目

1 个答案: