Question

我正在编写一个jQuery插件，需要将.data()添加到插件内的元素中，然后再检索它。当我在一个元素上运行该方法时，我无法通过其id引用该元素来检索存储的数据，如：

$('#name_of_the_element')

如果我使用$(this)引用元素，我可以访问数据。

我做错了什么？

以下是jQuery插件的代码以及我在其中使用的html文件的代码：

jQuery插件：

(function( $ ){

    var methods = {

        checkit : function(options) {

            return this.each(function(){

                var $this = $(this);

                $this.data('testdata','this is what i need to see');

            }); 
        }


    }

  $.fn.demoplug = function( method ) {        
    if ( methods[method] ) {
      return methods[ method ].apply( this, Array.prototype.slice.call( arguments, 1 ));
    } else if ( typeof method === 'object' || ! method ) {
      return methods.checkit.apply( this, arguments );
    } else {
      $.error( 'Method ' +  method + ' does not exist on jQuery.antigravity' );
    }    

  };

})( jQuery );

HTML文件：

<div role="main" id="main">
    <ul id="miniatures">
        <li><img src="img/thumbs/thumb-01.jpg"></li>
        <li><img src="img/thumbs/thumb-02.jpg"></li>            
        <li id="mov3"><img src="img/thumbs/thumb-03.jpg"></li>
        <li><img src="img/thumbs/thumb-04.jpg"></li>            
        <li><img src="img/thumbs/thumb-05.jpg"></li>
    </ul>
</div>

<script src="js/libs/jquery-1.7.2.min.js"></script>
<script src="js/libs/jquery.demoplug.js"></script>
<script>

    $(document).ready(function(){

        $('li#mov3').demoplug('checkit');

        alert( $('li#mov3').data('checkit') );  // not working

        $('li#mov3').click(function(){

            alert( $(this).data('testdata') );  // works

        });
    });

</script>

Answer 1

    alert( $('li#mov3').data('checkit') );  // not working

这是因为你在数据中提取'checkit'键但是你将键设置为'testdata'：

    $this.data('testdata','this is what i need to see');

将其更改为可行：

    alert( $('li#mov3').data('testdata') );

Answer 2

啊，错误是在错误的地方！我从插件中提取了这段代码，我正在努力展示我认为错误的地方，但真正的错误是插件里面我正在使用.clone（）方法和我错误的使用.clone（）方法犯了这个错误 - 它将LI元素的ID翻了一倍，这样我得到了两个id为“mov3”的LI。我没有阅读足够的文档来查看使用.clone（）时克隆的内容。谢谢你们回答！

检索.data（）的工作原理是$（this）引用的元素，而不是$（'＃id_of_element'）引用的元素

2 个答案: