Использование возврата true или возврата false для ссылки с целевым пробелом в jQuery

Question

У меня есть форма с target="_blank" при отправке.

Я хочу проверить форму, прежде чем запустить новое окно. Вместо этого я мог бы использовать window.open, но тогда он может быть заблокирован блокировщиками всплывающих окон.

Проблема, с которой я сталкиваюсь, заключается в том, что при проверке используется ajax, а время, необходимое для получения ответа на возвращаемое значение false, слишком велико, и при этом открывается новое окно.

 $('.submit').click(function(){
        $.post("/ajax/save/", { state: $('.state_field').val() },
            function(data) {
                if(data == 'false'){
                    alert('invalid state');
                                    return false;
                }else{

                    return true;
                }
            }
        );
  });

У кого-нибудь есть предложения, как мне обойти это?

Спасибо!

Answer 1

(Вам, вероятно, следует использовать $("form").submit(function() {}), потому что это также срабатывает, когда кто-то нажимает Enter в текстовом поле.)

Что вы могли бы сделать, это

1. Не включайте target="_blank" в форму
2. поймать представление и заблокировать его (желательно используя event.preventDefault();)
3. сделать вызов Ajax для проверки
4. из-за обратного вызова: добавьте target="_blank" и отправьте форму снова (вы можете использовать проверку, например $("form[target]").length == 1, чтобы проверить, отправляется ли форма во второй раз.

Хотя все это может заставить его работать, вам следует подумать о проверке формы сразу после того, как пользователь введет данные в каждое поле, это также значительно улучшит взаимодействие с пользователем.

Answer 2

Блокировщики всплывающих окон блокируют новые window, если они открыты в script execution context.Если окно открывается через действие пользователя, оно разрешается.Вы можете попытаться использовать jQuery ajax в режиме synchronous, это решит вашу другую часть вопроса, потому что функция не будет ждать до тех пор, пока не придет ответ ajax, и вы вернете true / false условно.

       $('.submit').click(function(){
            $.ajax({
              url:  "/ajax/save/", 
              type: "POST",
              async: false,
              data: { state: $('.state_field').val() },
              success: function(data) {
                    if(data == 'false'){
                        alert('invalid state');
                        return false;
                    }else{

                        return true;
                    }
                }
            );
      });

Answer 3

Используйте preventDefault метод event в начале вашего клика.

$('.submit').click(function(event){
event.preventDefault();
[...]

Это остановит отправку вашей формы и будет лучшим решением, чем использование return false;.

Если вам нужно выполнить перенаправление после вызова ajax, вы можете сделать это стандартным способом:

window.location.replace([url to redirect to]);