Question

我正在尝试编译一个基本的jQuery插件，它在调用时显示div提供的选项：

选择是否应在X毫秒之后或滚动时X px之后检查复选框
如果选择了这两个选项之一，请在px
否则什么都不做

调用所需选项的示例：

    $(document).ready( function() {
        $('#testInput').testing({
            myMethod      : delay,
            myValue       : 2000
        });
});

我目前取得的进展：JSFiddle（目前我还没有达到学习曲线的开头）

Answer 1

经过一番摆弄，我设法让这个工作（有点）。插件似乎工作正常。除了滚动功能有一些错误，我必须另外解决它 - 它会无限循环和更改复选框状态而不只是一次。

这是一个有效的fiddle

修改后的代码：

(function($) {

$.fn.testing = function( options ) {

    // Settings
    var settings = $.extend({
        delay           : null,
        delayTime       : null,
        scrolling       : null,
        scrollDist      : null
    }, options);

    return this.each( function() {
        var self = this;

        // Timeout
        setTimeout(function (){
           $(self).prop('checked', settings.delay);
        }, settings.delayTime);

        // Scroll
       if ($(window).scrollTop() > settings.scrollDist) {
          $(this).prop('checked', settings.scrolling);
       };

    });

}

}(jQuery));

// Plugin invoke
$(window).on("load resize scroll",function(){
    $('#testInput').testing({
        delay             : false,
        delayTime         : null,
        scrolling         : true,
        scrollDist        : 20,
    });
});

编写和编译一个简单的jQuery插件

1 个答案: