調用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插件

回答

相關問題