javascript - jQuery自定义函数扩展: store data into DOM element

Question

我有这个简单的功能

$.fn.extend({

    initCustomFunction: function(){

        var obj = { // some data }
        $(this).data('myObj', obj); // I want to attach obj to this element

    }, 

    startCustomFunction: function(){

        var obj = $(this).data('myObj');

        // do something

    }
});

$('#myId').initCustomFunction();
$('#myId').startCustomFunction();

在此示例中，我无法检索“startCustomFunction”内的“myObj”对象。我该如何解决这个问题？当我在特定元素上调用 Init 函数时，我想将一些数据附加到当前 DOM 元素。

Answer 1

两个函数定义之间需要用逗号。

$.fn.extend({

    initCustomFunction: function(){

        var obj = { foo: 'bar' };
        $(this).data('myObj', obj); // I want to attach obj to this element

    },

    startCustomFunction: function(){

        var obj = $(this).data('myObj');
        $('#result').text(obj.foo);

    }
});

$('#myId').initCustomFunction();
$('#myId').startCustomFunction();

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div id="myId"></div>
<div id="result"></div>