如何使用“漂亮的模态”删除确认答案

【问题标题】：How to use "nifty modals" to delete confirmation如何使用“漂亮的模态”删除确认
【发布时间】：2014-06-30 10:52:11
【问题描述】：

我用这个：http://tympanus.net/Development/ModalWindowEffects/

但问题是，如何将标准模式更改为类似 javascript confirm()。

这是 HTML：

<!-- Modal -->
    <div class="modal fade" id="mod-delete" tabindex="-1" role="dialog">
      <div class="modal-dialog">
        <div class="modal-content">
          <div class="modal-header">
              <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
          </div>
          <div class="modal-body">
              <div class="text-center">
                  <div class="i-circle warning"><i class="fa fa-warning"></i></div>
                  <h4>Big warning!</h4>
                  <p>You are going to delete this item!</p>
              </div>
          </div>
          <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
            <button type="button" id="delete-yes" class="btn btn-warning" data-dismiss="modal">Continue</button>
          </div>
        </div><!-- /.modal-content -->
      </div><!-- /.modal-dialog -->
    </div><!-- /.modal -->

这是触发此事件的链接：

<a class="label label-danger delete-confirmation" data-toggle="modal" data-target="#mod-delete" href="{$base_url}user/delete/{$user.UserID}"><i class="fa fa-times"></i></a>

然后我这样做：

// universal delete confirmation dialog
$('#delete-yes').on('click',function(){
    window.location = $(".delete-confirmation").attr('href');
});

但是！选择器$('.delete-confirmation') 获取页面上的每个项目（我正在从数据库中删除用户）。我想确认只删除一个被点击的项目。

简单地说：我点击删除用户（此链接具有“href”属性 - 包含删除链接）。我看到模态窗口，如果我点击“继续”，我会去删除这个项目的链接。

有人解决过这个问题吗？

【问题讨论】：

标签： javascript jquery confirmation

【解决方案1】：

我建议：

将点击链接的 href 值传递给模态 div，你可以这样做：

$('.delete-confirmation').on('click',function(){ $('#mod-delete').attr("nhref", $(this).attr("href)); });
将 href 值传递给模态 div 后，您可以使用：

$('#delete-yes').on('click',function(){ window.location = $("#mod-delete").attr('nhref'); });

可能不是最好的解决方案，但它应该可以工作（可能需要对代码进行一些小改动，但总体思路可行）。

希望这会有所帮助。

【讨论】：