如果用户用户使用引导程序对话框确认,则重定向到相应的链接

Jay*_*ari 1 html javascript css redirect twitter-bootstrap

首先,javascript确认不是我在这里寻找的.请仔细阅读.即将onClick attr放到每个链接上并传递一个函数,通过警告正常的系统对话框来确认用户不是我想要的.

我使用了bootstrap的对话框而不是系统提供的常规对话框.

这里是不同项目的几个删除按钮

<a href="www.mysite.com/product/1" data-target="#myModal"  data-toggle="modal"><i class="icon-remove"></i> Delete</a>
<a href="www.mysite.com/product/2" data-target="#myModal"  data-toggle="modal"><i class="icon-remove"></i> Delete</a>
<a href="www.mysite.com/product/3" data-target="#myModal"  data-toggle="modal"><i class="icon-remove"></i> Delete</a>
Run Code Online (Sandbox Code Playgroud)

下面是使用Bootstrap显示模态的标记.

<div class="modal small hide fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-header">
    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
    <h3 id="myModalLabel">Confirm Delete ?</h3>
  </div>
<div class="modal-body">
  <p class="error-text"><i class="icon-warning-sign modal-icon"></i>Are you sure you want to Delete the Category and all its associated Properties?</p>
  </div>
  <div class="modal-footer">
    <button class="btn" data-dismiss="modal" aria-hidden="true">Cancel</button>
    <button class="btn btn-danger" data-dismiss="modal">Delete</button>
  </div>
</div>
Run Code Online (Sandbox Code Playgroud)

对话框显示正确,但是在按对话框中的删除按钮后,我无法重定向到与上面链接对应的页面,模式只是消失而没有重定向.

小智 6

只需将类添加remove-item到您的链接,将此脚本添加到您的页面即可.干净整洁.

<script>
$(function () {
  $('a.remove-item').click(function () {
    var url = this.href;
    $('#myModal .btn-danger').click(function () {
      window.location.href = url;
    });
  });
});
</script>
Run Code Online (Sandbox Code Playgroud)