调用JQuery插件

我是Jquery的新手，一直在关注一些教程，但这让我陷入困境。我找到了一个教程来制作一个很好的Jquery时钟，但我试图将它转换为一个插件。我遇到的问题是我已经看到如何调用一个基于单独的插件的插件，但这让我难住。你可以看看我的代码，并告诉我如何去调用插件吗？由于调用JQuery插件

HTML：

<head> 
    <script src="jquery.min.js"></script> 
    <script src="clock.js"></script> 
    <script> 
     // Need to call 

    </script> 

    <style> 
      #clock { 
       position: relative; 
       width:280px; 
       height: 285px; 
       margin: 20px auto 0 auto; 
       background: url(images/clockface.png); 
       list-style: none; 
      } 

      #sec, #min, #hour { 
       position: absolute; 
       width: 7px; 
       height: 70px; 
       top: 125px; 
       left: 140px; 
      } 

      #sec { 
       background: url(images/second.png); 
       z-index: 3; 
      } 


      #min { 
       background: url(images/min.png); 
       z-index: 2; 
      } 

      #hour { 
       background: url(images/hour.png); 
       z-index: 1; 
      } 
    </style> 
</head> 
<body> 
    <ul id="clock"> 
     <li id="sec"></li> 
     <li id="hour"></li> 
     <li id="min"></li> 
    </ul> 
</body>

JS ...

(function($){ 
$.fn.mclock = function(){ 
    var defaults = { 
     var seconds = new Date().getSeconds(); 
     var sdegree = seconds * 6; 
     var hdegree = hours * 30 + (mins/2); 
     }, 
     options = $.extend(defaults, args); 
     console.log(options); 

    this.each(function(){ 
     setInterval(function() { 
    var seconds = new Date().getSeconds(); 
    var sdegree = seconds * 6; 
    var srotate = "rotate(" + sdegree + "deg)"; 

    $("#sec").css({ "transform": srotate }); 

    }, 1000); 

    setInterval(function() { 
    var hours = new Date().getHours(); 
    var mins = new Date().getMinutes(); 
    var hdegree = hours * 30 + (mins/2); 
    var hrotate = "rotate(" + hdegree + "deg)"; 

    $("#hour").css({ "transform": hrotate}); 

    }, 1000); 

    setInterval(function() { 
    var mins = new Date().getMinutes(); 
    var mdegree = mins * 6; 
    var mrotate = "rotate(" + mdegree + "deg)"; 

    $("#min").css({ "transform" : mrotate }); 

    }, 1000); })(jQuery);

来源

2013-01-01 Mark

$（ '＃时钟'）mclock（）。 ...我看不到任何参数的需要。 –

有点不清楚你想要什么马克tbh - 你似乎在说'我怎么称呼这个功能'，但也说'某个单独的div'。你想要什么？ –

嗨保罗，使用我得到的错误 - 未捕获TypeError：对象[对象对象]在控制台中没有方法'mclock'template.html：8 （匿名函数）。 – Mark

UPDATE：剥回的Hello World透露失踪括号}

注意：你是不是返回（ing）this.each可能会破坏你的插件

骷髅插件

/* 
* PLUGIN-NAME 
* PLUGIN-DESCRIPTION 
* 
* Copyright 2011 YOUR-NAME YOUR-WEBSITE-URL 
* Released under the MIT License 
*/ 

(function($){ 

$.fn.PLUGIN_NAME = function(options) { 

    var opts = $.extend({}, $.fn.PLUGIN_NAME.defaults, options); 

    return this.each(function() { 

    }); 

}; 

$.fn.PLUGIN_NAME.defaults = { 
}; 

})(jQuery);

来源

2013-01-01 13:21:51

嗨保罗，谢谢你的帮助。你的建议，剥离它回来得到Hello World工作是伟大的，必须有一些语法错误，因为我现在所有的工作:) – Mark

@Mark - 是缺少的回报？在这种情况下，这是答案 - 如果你仍然有失踪的逆转，那么这不是..？ :)（和gld帮助任何一种方式只是标记只作为答案，如果缺少的回报是正确的） –

我认为它错过了一个地方，因为我在一个警报中显示了hello world，它不会说仍然存在错误。所以我然后重新制作一个简单的插件来提醒Hello World哪些工作正常。然后，我重新使用了以前的其他代码，但使用了新的基本功能，并且工作正常。所以，你似乎一定是一个胭脂或缺少一个人物。但感谢您的帮助，如果你不建议尝试一个简单的Hello World我不会修复它:) – Mark

调用JQuery插件

回答

相关问题