Javascript 如何调用自定义jQuery函数

我对jQuery比较陌生，我正在尝试创建一个自定义jQuery函数。该函数将旋转图像。很简单！下面是我目前调用函数的方式：

function rotate(degree) {
    $(this).css({
        "transform": "rotate(" + degree + "deg)",
        "-ms-transform": "rotate(" + degree + "deg)", /* Internet Explorer */
        "-moz-transform": "rotate(" + degree + "deg)", /* Firefox */
        "-webkit-transform": "rotate(" + degree + "deg)", /* Safari and Chrome */
        "-o-transform": "rotate(" + degree + "deg)" /* Opera */
    });
}

我想这样调用上面的函数：

$(".object").rotate(8);

我如何更改上述函数以使其像这样工作？

无需使用每个函数。jQueryCSS函数可以在整个集合上工作，就像几乎每个jQuery函数一样

这里至少接近于创建新jQuery插件的最佳实践和业界认可的方法。代码无法工作的原因是，您所做的只是声明了一个全局函数。要使jQuery对象能够访问该函数，必须将该函数添加到jQuery对象本身，以便它与该对象的实例正确配对，从而使该访问成为当前jQuery集。如下所示。函数中有趣的东西包装一切都是出于各种原因完成的，你可以在大多数jQuery插件在线教程中阅读到。注意，在jQuery函数中，不需要这样做，因为它已经引用了jQuery匹配集

(function($, window, undefined) {
   $.fn.rotate = function(degree) {
      return this.css({
         "transform": "rotate(" + degree + "deg)",
         "-ms-transform": "rotate(" + degree + "deg)", /* Internet Explorer */
         "-moz-transform": "rotate(" + degree + "deg)", /* Firefox */
         "-webkit-transform": "rotate(" + degree + "deg)", /* Safari and Chrome */
         "-o-transform": "rotate(" + degree + "deg)" /* Opera */
      });
   };
   $.fn.unrotate = function() {
      return this.css({
         "transform": "",
         "-ms-transform": "", /* Internet Explorer */
         "-moz-transform": "", /* Firefox */
         "-webkit-transform": "", /* Safari and Chrome */
         "-o-transform": "" /* Opera */
      });          
   };
}(jQuery, window));

我添加了一个unrotate函数，这样您也可以轻松地删除css

---

表示jQuery 1.8将自动尝试前缀，因此如果您使用的是该版本或更高版本，则可能只需要transform属性。

而您的问题是。。什么目前，您的代码看起来无效-您正在对对象调用函数，但该函数不是该对象类型的成员。我认为您应该对扩展jQuery对象进行一些研究。问题在标题中，这不是一个真正的问题，因为它没有任何意义。您不会将其传递到任何地方-这是函数上下文中自动可用的内容。您可以将对象引用作为函数参数传递，包括调用范围中的计算结果，但这不是您在这里要做的。rotate不是一个jQuery方法，您不能这样调用它。不，它是一个CSS方法，我正在使用jQueryThat调用它。这正是我想要的，谢谢。也许可以返回这个。每个都保持链接。jQuery1.8将自动尝试前缀。我必须停止用手机回答问题。太慢了！只是一些注释：你不需要每个。。。css函数已经在jQuery数组对象的每个成员元素上运行。另外，不需要单独的return语句，只需返回这个.css。。。；既然jQuery在内部使用each方法，为什么要使自己的代码更复杂、更长，从而更难理解和维护？

(function($, window, undefined) {
   $.fn.rotate = function(degree) {
      return this.css({
         "transform": "rotate(" + degree + "deg)",
         "-ms-transform": "rotate(" + degree + "deg)", /* Internet Explorer */
         "-moz-transform": "rotate(" + degree + "deg)", /* Firefox */
         "-webkit-transform": "rotate(" + degree + "deg)", /* Safari and Chrome */
         "-o-transform": "rotate(" + degree + "deg)" /* Opera */
      });
   };
   $.fn.unrotate = function() {
      return this.css({
         "transform": "",
         "-ms-transform": "", /* Internet Explorer */
         "-moz-transform": "", /* Firefox */
         "-webkit-transform": "", /* Safari and Chrome */
         "-o-transform": "" /* Opera */
      });          
   };
}(jQuery, window));