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

Question

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

• 选择是否应在X毫秒后或滚动X px后选中一个复选框，
• 如果选择了这两个选项之一，则以px为单位设置延迟值或滚动距离
• 否则什么都不做

所需选项的示例调用：

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

我目前在这里取得的进展： JSFiddle （与目前的学习曲线尚不多）

Answer 1

经过一番摆弄之后，我设法使它正常工作。 插件似乎运行良好。 除非滚动功能存在一些错误，否则我必须对它进行额外的整理-它循环并无限期地更改复选框状态，而不仅仅是一次。

这是一个工作的小提琴

并修改代码：

(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,
    });
});