кнопка отключения не работает в jquery и ajax

Question

Я хочу отключить кнопку отправки после того, как пользователь нажимает кнопку отправки в форме HTML.Но форма перенаправляет непосредственно на следующую страницу без отключения кнопки.

Идеальная последовательность:

1. Пользователь нажимает кнопку отправки
2. Проверка выполняется
3. Кнопка отправки отключает
4. ФормаДанные отправляются в базу данных / электронную таблицу
5. Пользователь перенаправлен на страницу благодарности

При использовании следующего кода единственная проблема заключается в том, что кнопка отправки не отключается, а все остальноеработает отлично.Пожалуйста, предложите альтернативу для исправления кода.Я использую WordPress, который работает на jquery 1.4.1.Таким образом, $ input.prop ('disabled', true) также не работал

HTML:

    <form id="test-form" method="post" name="test-form" action="">
<div>
<input class="input-field" name="Name" required type="text" placeholder="Enter name" />
</div>

<div>
<input class="input-field" name="Phone" required type="number" placeholder="Enter number" />
</div>

<div><button id="submit-form" class="btn" type="submit" name="submit-form">Submit</button></div>
</form>

JQUERY

var $form = $('form#test-form');
url = 'https://abcd';


 $form.submit(function(e) {
  $('submit-form').attr('disabled', 'disabled');
  var jqxhr = $.ajax({
    url: url,
    method: "GET",
    dataType: "json",
    data: $form.serializeObject()
  }).success(function() {
            location.replace("/thank-you/");
        });
e.preventDefault();
      });
    });

Answer 1

вы получили идентификатор был неверным.попробуйте это

$(function(){
var $form = $('#test-form');
url = 'https://abcd';
 $form.submit(function(e) {
    e.preventDefault();    
  $('#submit-form').attr('disabled', 'disabled');
  var jqxhr = $.ajax({
    url: url,
    method: "GET",
    dataType: "json",
    data: $form.serializeObject()
  }).success(function() {
            location.replace("/thank-you/");
        });
      });
      });