Javascript 很难让jQuery与WordPress协同工作

我在这个论坛上查看了其他示例，但没有任何效果。该脚本在独立的bootstrap4文件中运行良好，但在WordPress中根本不起作用。 使用“下陷”子主题。这是一个在移动视图中显示的按钮，用于关闭/打开平移。

---

在Wordpress中，$不用于jquery。尝试下面的代码，我认为这对你来说是可行的

jQuery(document).ready(function($) {
        jQuery('#SearchArea').on('show.bs.collapse', function() {
            jQuery('#closeButton').html('Open');
        });
        jQuery('#SearchArea').on('hide.bs.collapse', function() {
            jQuery('#closeButton').html('Close');
        });

    });

WordPress以“无冲突”模式加载jQuery，以避免与其他库的名称空间冲突

将脚本包装在一个匿名函数中，该函数将jQuery映射到

$

，如下所示：

(function($) {
  $('#SearchArea').on('show.bs.collapse', function() {
    $('#closeButton').html('Open');
  });
  $('#SearchArea').on('hide.bs.collapse', function() {
    $('#closeButton').html('Close');
  });
})( jQuery );

---

谢谢你的帮助。我犯了一个错误。ID上的拼写错误。真不敢相信我花了这么多时间试图解决这个问题…哈哈

你是说移动菜单的“三明治”？你到底把这个代码片段放在wordpress的什么地方了？我把它添加到footer.php。我把它移到顶部、底部和我能想到的任何地方，但它根本不起作用。它在移动切换之后加载。有一个黄色按钮，仅在手机（sm）上显示。切换功能正常，只是无法使按钮上的文本更改为代码笔中的文本。控制台中是否显示任何错误？

(function($) {
  $('#SearchArea').on('show.bs.collapse', function() {
    $('#closeButton').html('Open');
  });
  $('#SearchArea').on('hide.bs.collapse', function() {
    $('#closeButton').html('Close');
  });
})( jQuery );