Question

我有一个ajax调用，在第一次提交表单之后效果很好，之后页面上的所有javascript似乎都会中断。以及表格不会再提交ajax。

这是我的ajax电话：

$('form').submit(function(event) {
   $('input:submit').attr("disabled", true).after('<p class="loading">Searching...</p>');

$.ajax({
  type: "POST",
  url: pathname,
  data: $(this).serialize(),
  success: function(data) {
    $('#container').html("<div id='message'></div>");
    $('#message').append(data).hide().fadeIn(1500);
  },
});
event.preventDefault();
});

我的控制台没有错误。可能导致这种情况的任何想法？

Answer 1

我解决了这个问题，主页内容正在发生变化。这导致javascript卸载。所以我需要使用Jquery .on / .live然后才能工作。出于何种原因，这在一台服务器上运行良好，而在另一台服

Answer 2

提交表单后删除disabled。并删除@JustinRusso提到的,。

$('form').submit(function(event) {
   $('input:submit').attr("disabled", true).after('<p class="loading">Searching...</p>');

    $.ajax({
      type: "POST",
      url: pathname,
      data: $(this).serialize(),
      success: function(data) {
        $('#container').html("<div id='message'></div>");
        $('#message').append(data).hide().fadeIn(1500);
        $('input:submit').removeAttr("disabled");
      }
    });
    event.preventDefault();
});

Answer 3

使用方法如下：无需定义event.preventDefault();

$('form').submit(function(event) {
   $('input:submit').attr("disabled", true).after('<p class="loading">Searching...</p>');

    $.ajax({
      type: "POST",
      url: pathname,
      data: $(this).serialize(),
      success: function(data) {
        $('#container').html("<div id='message'></div>");
        $('#message').append(data).hide().fadeIn(1500);
        $('input:submit').removeAttr("disabled");
      },
    });
   return false;
});

Ajax调用后，Javascript / Jquery停止工作

3 个答案: