基于 (this).attr() 的 Jquery AJAX if/else

Question

我的目标是仅在用户点击联系页面链接时加载验证码。

我已经成功构建了一个网站，它使用导航链接将外部 HTML 内容加载到索引页面的主要内容 div 中，基于以下功能：

$('div#index_content').load($(this).attr('href') + ' #content');

当用户单击导航链接时，来自 6 个单独的 .html 或 .php 文件之一的内容被加载到 index.html 容器中：

<div id="menu">
    <ul>
        <li><a href="home.html" class="active">Home</a></li>
        <li><a href="fine_art.html" class="inactive">Fine Art</a></li>
        <li><a href="sketches.html" class="inactive">Sketches</a></li>
        <li><a href="props.html" class="inactive">Props</a></li>
        <li><a href="contact.php" class="inactive">Contact</a></li>
    </ul>
</div>

这一切都 100% 起作用。

下一步是在 .load 语句中附加一个函数，该函数将 recaptcha 加载到我的联系表单中 id="captcha" 的空 div 中：

$('div#page_content').load(($(this).attr('href') + ' #contentB'), 
   function() {
     Recaptcha.create("my public key", "captcha"); 
   }
 );

该站点此时仍在运行，但每次单击导航链接时调用验证码的函数都会运行，我想创建一个 if() 语句，如果 $ (this).attr('href') 正在加载contact.php 内容。换句话说，我希望它只在用户点击导航栏中的“联系人”时加载验证码。

我尝试了这两个版本的函数，但验证码在任何一种情况下都不会加载：

$('div#page_content').load(($(this).attr('href') + ' #contentB'), 
   function() {
       if ($(this).attr('href') == 'contact.php') {
               Recaptcha.create("my public key", "captcha"); 
       }
   }
 );

还有……

$('div#page_content').load(($(this).attr('href') + ' #contentB'), 
   function() {
       var ifContact = $(this).attr('href');
       if (ifContact == 'contact.php') {
               Recaptcha.create("my public key", "captcha"); 
       }
   }
 );

谁能告诉我我的 if() 语句有什么问题？ $(this).attr('href') 实际上是否持有一个可以等于某物的值？

Answer 1

内、外函数中的this不代表同一个对象，将href的值存储在内函数外，并在内函数中使用该值。

var href = $(this).attr('href');
$('div#page_content').load(href + ' #contentB', 
   function() {
       if (href == 'contact.php') {
               Recaptcha.create("my public key", "captcha"); 
       }
   }
 );