自定義jQuery插件，公開方法和存儲元素信息

我在寫我的第一個jQuery插件，但遇到了一些問題。在我的第一次嘗試中，我成功實現了基本插件，但現在我需要公開其他方法供客戶端使用。自定義jQuery插件，公開方法和存儲元素信息

無數篇文章，stackoverflow帖子和閱讀文檔後，我想我可以創建一個對象並將其存儲在元素.data（）緩存中。但是，我寫的代碼似乎在我調用插件時引用同一個對象。

無可否認，我仍然處於jQuery的學習階段，所以我的術語缺乏，Google一直無法爲我提供幫助。

var CONST_TEST_KEY = "test-data-key"; 

(function($){ 
var TestObject = function(e, o){ 
    var elem = $(e); 

    this.random = Math.floor(Math.random() * 100); 

    this.GetRandom = function() { 
     alert(this.random); 
    } 
}; 

$.fn.testJQueryPlugin = function(o) { 
     return $.each(function() { 
      var currentElement = $(this); 

      if(currentElement.data(CONST_TEST_KEY)) 
       return; 

      currentElement.data(CONST_TEST_KEY, new TestObject(currentElement, {})); 
     }); 
}; 
})(jQuery)

的HTML：

<script type="text/javascript"> 
    $(document).ready(function() { 
     var object1 = $("#entry1").testJQueryPlugin(); 
     var object2 = $("#entry2").testJQueryPlugin(); 

     alert($(object1).data(CONST_TEST_KEY).random); 
     alert($(object2).data(CONST_TEST_KEY).random); 
    }); 
</script> 
</head> 
<body> 
    <div id="entry1"> 
     x 
    </div> 
    <div id="entry2"> 
    y 
    </div> 
</body>

這個代碼顯示兩個警報都具有相同的值。我預計每個警報都有不同的價值。我會感謝任何解決方案，指針，甚至更好地解釋爲什麼它以這種方式工作和/或爲什麼我應該採取不同的方式。

來源

2010-11-05 Skyler

至少有一個直接的問題，我看到的是在您的來電each()。看起來你在混合jQuery.each()（一個泛型迭代函數）和.each()。你甚至不會傳遞一個適當的第一個參數到jQuery.each()，所以它不會迭代你的想法。嘗試這種對尺寸：

http://jsfiddle.net/mattball/xaydr/

（包括一些其他清理，以及像提供使用return this;適當鏈）

來源

2010-11-05 04:57:19

感謝您的快速回復。現在我感到很蠢，在我的實際插件中我正確使用它，但是在我的POC中，我錯過了它。 – Skyler 2010-11-05 14:41:33

@Skyler：不客氣。剪切和粘貼總是比嘗試重新鍵入時提問更好:) – 2010-11-05 14:42:49

問題是您撥打each()時缺少一個參數。第一個參數是要迭代的集合，第二個參數是要調用的函數。

它應該是這樣的：

$.fn.testJQueryPlugin = function(o) { 
    return $.each(this, function() { 
     var currentElement = $(this); 

     if(currentElement.data(CONST_TEST_KEY)) 
      return; 

     currentElement.data(CONST_TEST_KEY, new TestObject(currentElement, {})); 
    }); 
};

see it in action at JSFiddle

來源

2010-11-05 04:54:52 Lee

我認爲，[其他'。每個（）']（HTTP： //api.jquery.com/each）是應該在這種情況下使用的 - 而不是泛型迭代器函數。 – 2010-11-05 05:03:11

自定義jQuery插件，公開方法和存儲元素信息

回答

相關問題