创建一个toggle data- *属性jQuery函数

时间:2013-04-24 09:47:00

标签: javascript jquery

我正在开发一个新项目并使用'data-js'属性。我目前正在手动切换每个data-js属性,例如:

$(this).attr('data-js', $(this).attr('data-js') == 'unstar' ? 'star' : 'unstar')

我有一个'shell'用于创建jQuery的插件式扩展,如下所示:

!function($) {
            $.fn.toggleData = function(options) {
                var settings = $.extend({
                    someEvent: function() {
                        alert('default')
                    }
                }, options)

                return this.each(function() {
                    settings.someEvent()
                })
            }
        }(jQuery)

所以我基本上想要的是创建一个能给我以下内容的函数,它可以在所有data-js属性中重用:

$('[data-js=unstar]').click(function(){
    $(this).toggleData('unstar', 'star')

})

关于如何做到这一点或更好的方式的任何想法!...非常感谢。

1 个答案:

答案 0 :(得分:0)

这是你追求的那种东西吗?我只是将克隆放入以证明它适用于所有未来的[data-js]数据类型。

$('body').on('click', '[data-js]', function () {

if ($(this).attr('data-js') == 'unstar' || $(this).attr('data-js') == 'star') {

    $(this).attr('data-js', $(this).attr('data-js') == 'unstar' ? 'star' : 'unstar');


    alert($(this).attr('data-js'));
    $(this).clone().insertAfter(this);

}
});