Question

我在我的网站上有一些流程，其中包含几个步骤。为了导航我有＆＃34;之前＆＃34;和＆＃34; next＆＃34;纽扣。这些按钮是具有href属性的<a>元素（用于访问上一步和下一步）。

下一步按钮用作下一步的门，但也可以在继续之前验证当前步骤中的某些字段。

这就是点击下一个按钮时会发生的情况：

href值保存在变量$url中。
preventDefault()阻止该链接打开网址。
进行了一些验证检查。
如果他们返回＆＃34; true＆＃34;，$url将在window.location中加载。

对于某些步骤，我需要使用确认框对用户进行另一次检查。但问题出现了：

问题：

当confirm()返回＆＃34; false＆＃34;时，用户不应转到下一页。但是功能1的window.location＆＃34;否则＆＃34;现在是函数2的preventDefault()。

1。默认的下一个按钮功能：

$('#next_link').click(function(e) {
    var url = $(this).attr('href');
    e.preventDefault();             
    if(wiz_validate_required() && wiz_is_step_done()) {
        window.location = url;  
    } 
});

2。确认框功能：

$('.dimensions-check').click(function(e) {
    if(confirm('Have you specified the dimensions in millimeters?') == false) {
        e.preventDefault();
    }
});

Answer 1

你在哪里打电话给尺寸检查？

e.preventDefault（）仅取消提交表单的按钮的默认操作。无论e.preventDefault，windows.location都将始终重定向您。

$('#next_link').click(function(e) {
    var url = $(this).attr('href');
    e.preventDefault();             
    if(wiz_validate_required() && wiz_is_step_done()) {
        //If dimension isnot prompt{
          //windows.location
        //}else call dimension prompt
            
    } 
});

您可以像这样放置windows.location：

$('.dimensions-check').click(function(e) {
    if(confirm('Have you specified the dimensions in millimeters?') == true) {
        window.location = url;
    }
});

Answer 2

我会做那样的事情。如果您对代码有任何疑问，请询问！

fiddle

    // These can be changed for each step if you want or not a confirmation 
   var needs_confirm = true;
   var cb_message = 'Have you specified the dimensions in millimeters?';

   $('#next_link').click(function(e) {

     var url = $(this).attr('href');
     e.preventDefault();

     if (needs_confirm === true) {
       if (confirm_box(cb_message) === true) {
         redirect_window(url);
       }
     } else {
       redirect_window(url);
     }

   });


   function confirm_box(cb_message) {
     if (confirm(cb_message) === true) {
       return true;
     } else {
       return false;
     }
   }

   function redirect_window(url) {
     if (wiz_validate_required() && wiz_is_step_done()) {
       window.location = url;
     }
   }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<div id="next_link"><a href="#">link</a>
</div>

由window.location覆盖的preventDefault（）

2 个答案: