javascript - 无论如何，使用 Jquery 来检测 Ajax 是否加载某些 HTML？

Question

一个 friend 在一个平台上有一个网站，我们无法访问源代码，但可以添加我们自己的 JavaScript。网站的部分内容通过 Ajax 加载。

我需要在加载特定的 HTML 片段时添加一个元素。到目前为止我发现:

$(document).ajaxComplete(function() {
   $('.booking .simple_form input[type="submit"]').hide();
   $('.booking .simple_form').append('<a id="login-btn" href="#">Login</a>');
});

但是由于页面上有 4 条 Ajax 加载的内容，因此该元素被追加了 4 次。

我尝试将其包装在 if 语句中，例如:

$(document).ajaxComplete(function() {
  if ($('#login-btn').length) {
    $('.booking .simple_form input[type="submit"]').hide();
    $('.booking .simple_form').append('<a id="login-btn" href="#">Login</a>');
  }
});

但这不起作用 - 什么也没有出现。

有人知道如何添加 1 个按钮吗？

Answer 1

你的条件是错误的。

if ($('#login-btn').length) {
    $('.booking .simple_form input[type="submit"]').hide();
    $('.booking .simple_form').append('<a id="login-btn" href="#">Login</a>');
  }

应该是

if (!$('#login-btn').length) {
    $('.booking .simple_form input[type="submit"]').hide();
    $('.booking .simple_form').append('<a id="login-btn" href="#">Login</a>');
  }

当没有元素时，必须检查falsy，然后输入。在条件前添加 !。