javascript - 创建切换 data-* 属性 jQuery 函数

Question

我正在开发一个新项目并使用“data-js”属性。我目前正在手动切换每个 data-js 属性，例如：

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

我有一个用于创建 jQuery 插件式扩展的“shell”，如下所示：

!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')

})

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

Answer 1

这是你追求的那种东西吗？我刚刚将克隆放入以证明它适用于所有未来的 [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);

}
});