2015-04-16 2 views
0

У меня есть процесс на моем веб-сайте, который содержит несколько шагов. Для навигации у меня есть «предыдущие» и «следующие» кнопки. Этими кнопками являются <a> элементы с атрибутом href (чтобы перейти к предыдущему и следующему шагу).preventDefault() overruled by window.location

Следующая кнопка работает как дверь для следующего шага, но также для проверки некоторых полей текущего шага, прежде чем она будет продолжена.

Так это то, что происходит при нажатии на следующую кнопку:

  1. HREF значение спасся в переменной $url.
  2. preventDefault() препятствует открытию ссылки на URL.
  3. Выполнены некоторые проверки достоверности.
  4. Если они возвращают «true», то $url будет загружен в window.location.

Для некоторых шагов мне нужно сделать еще одну проверку для пользователя с помощью поля подтверждения. Но здесь возникает проблема:

Проблема:

Когда confirm() возвращает «ложь», пользователь не должен перейти на следующую страницу. Но функция window.location функции 1 «перекрывает» функцию preventDefault() функции 2.

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(); 
    } 
}); 
+0

Что размеры проверить? Разве это и next_link сосуществуют где-то? Возможно, вам нужно создать функцию, которая использует поле подтверждения, и вернуть true или false, а затем выполнить событие click, но вам нужно поделиться больше кода, чтобы получить прямой ответ! – codegaze

+0

можете ли вы поставить оператор if на шаге 1, чтобы не устанавливать '$ url', если требуется вторая проверка? то есть. 'if (! secondCheckRequired) {// установить $ url}' – Sionnach733

+0

@idioteque dimensions-check и next_link действительно существуют и есть и ID и класс на одной и той же кнопке. Это проблема. Мне нужно, чтобы эти две функции были разделены, в противном случае проблем не было, и я использовал каждую функцию. И больше нет кода для обмена, потому что только эти две функции конфликтуют друг с другом. Кстати, функции wiz_validate_required() и wiz_is_step_done() не дают проблемы, я это проверил. – Robbert

ответ

0

Я хотел бы сделать что-то подобное. Если у вас есть какие-либо вопросы по поводу кода, пожалуйста, спросите!

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> 
0

Где вы назвали размер проверки?

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; 
 
    } 
 
});

Смежные вопросы