Question

我为wordpress创建一个主题，我需要使用一些jQuery。我已经在网上找到了一些代码，而且我自己做了一些代码。但是，当使用wordpress提供的jQuery时，它处于noConflict模式，而不是使用$，它被设置为“jQuery”。这很好但我不想修改我的所有代码和我在网上找到的任何代码使用“jQuery”而不是$。

因此它告诉我，通过在最后放置function ($)，您可以使用$作为jQuery别名，但仅限于该函数范围。这很好，但我希望它能够工作并传递给我在该范围内调用的函数。这就是我的问题所在。如何在我的“resizeandcenter”函数中使用$ jQuery代码。

jQuery('.artworklist > li > a > img').load(function ($){
   resizeitems('artworklist');
});

这是我的功能，我希望能够使用$ inside，因为我不想修改我的所有代码/以及我在网上找到的任何代码。

function resizeitems(elementname){
    //Do some jquery stuff using $
}

也许还有另一种方法可以做我正在做的事情，或者我做错了什么？

编辑：

我的函数“resizeitems”在我的页面标题中包含的js文件中独立。

另一个代码，我的第一个代码块中的jQuery代码位于脚本块中页面的底部。

所以有点不确定答案说要包装我的功能吗？

Answer 1

您可以将整个代码包装在一个自执行的闭包中（或者就绪/加载闭包），就像这样

(function ($) {
    // do your stuff here
}(jQuery));

然后你可以在那个闭包中使用$

以下是您jsfiddle的示例

window.addEventListener("load", function () {
    (function ($jq) {
        $jq("body").append($jq("<div>").text("hello"));
    }(jQuery));
}, false);

以下是使用jquery的ready事件监听器

的示例

jQuery(document).ready(function() {
    (function ($jq) {
        $jq("body").append($jq("<div>").text("hello"));
    }(jQuery));
});

在jsfiddle

上

或jquery的另一个替代方案，主要是语法更改，as suggested @ Mathletics

jQuery(function($jq) {
      $jq("body").append($jq("<div>").text("hello"));
});

在jsfiddle

上

Answer 2

您需要将jQuery传递到包含代码的顶级闭包中。通常这是在$(document).ready()调用内。一个基本的例子如下：

jQuery(function($) {
      function resizeitems(elementname){
          //Do some jquery stuff using $
      }
      $('.artworklist > li > a > img').load(function (){
          resizeitems('artworklist');
      });
});

jQuery现在别名为该{8}内的$。

Answer 3

所有重要的是这里的范围。如果您的其他函数在其他范围内，您可以将全局jQuery重新映射到该范围内的$，这样您就不必更改代码。

var $ = jQuery;

您甚至可以在全局范围内设置它，但如果用于其他内容，您可能会影响页面上$的其他用法：

window.$ = jQuery;

将Jquery别名传递给javascript函数

3 个答案: