jQuery插件打破這個問題

我正在寫一個插件，並試圖包裝每個方法內的函數，但它打破了插件。如果塊內容未包裹在「this.each」插件中。我明白，爲了傳遞多個選擇器，我需要「返回this.each」或不？我也想消除在插件內部使用選擇器的需要，例如「#the_lead」，而不是使用「this」。jQuery插件打破這個問題

(function($) { 
    $.fn.scroll_lead = function (options) { 
     var defaults = { 
      speedup: 500 
     }; 
     var options = $.extend({}, defaults, options); 
     return this.each(function() { 
      var $window_height = $(window).height(); 
      var $document_height = $(document).height(); 
      var $hide_lead; 
      $(window).scroll(function() { 
       var $scrollTop = $(window).scrollTop(); 
       if (!$hide_lead) { 
        if ($scrollTop > ($document_height/2)) { 
         $("#the_lead").slideDown(options.speedup); 
        } else { 
         $("#the_lead").slideUp(500, function() { 
          $(this).hide(); 
         }); 
        } 
       } 
      }); 
      $('#hide_lead').click(function (e) { 
       $(this).parent().parents('div').hide(); 
       hide_lead = true; 
       e.preventDefault(); 
      }); 
     }); 
    }; 
})(jQuery);

來源

2013-02-08 Codex73

，你能否告訴我們休息嗎？它如何打破插件？你是說當你不把它包裝在'this.each'中時它有效嗎？你有錯誤嗎？ –

@ExplosionPills是的，如果我不包裝它this.each它的工作...沒有錯誤...我補充了其餘的... – Codex73

你能給我們一個例子使用jsfiddle.net上的插件嗎？ –

幾件事;

分配$（本），以$這一點，並使用你的插件內的任何函數內，在本教程中說，http://docs.jquery.com/Plugins/Authoring。

return this.each(function() { 
    var window_height = $(window).height(); 
    var document_height = $(document).height(); 
    var hide_lead; 
    $this = $(this); 
    $(window).scroll(function() { 
     var scrollTop = $(window).scrollTop(); 
     if (!hide_lead) { 
      if (scrollTop > (document_height/2)) { 
       $this.slideDown(options.speedup); 
      } else { 
       $this.slideUp(500, function() { 
        //$(this).hide(); 
       }); 
      } 
     } 
    }); 
    $this.click(function (e) { 
     $(this).parent().parents('div').hide(); 
     hide_lead = true; 
     e.preventDefault(); 
    }); 
});

儘量避免父對象的操縱你的插件裏面，包括$（窗口）和$（文件）。

可以讀取窗口和文檔的屬性，但是如果它在您的插件中被操縱，它將按您的選擇器的次數進行修改。

在你的代碼中，因爲你使用this.each，你幾次綁定窗口的滾動函數。例如，$（「div」）。scroll_lead（）會將「滾動」方法綁定到與文檔標籤一樣多的窗口。這同樣適用於$（document）和插件目標的所有父元素。
如果可能，它是你的意圖，使用元素滾動方法，而不是窗口滾動。

要獲得滾動值$（EL）.scrollTop（）

要向下滾動，$（EL）.scrollTop（NUMBER）

要綁定onScroll方法，$（EL）.scroll（functtion （）{...}）

希望它可以幫助

來源

2013-02-08 20:25:21 allenhwkim

我明白上面第2點的前提，但是如何在真實世界中編寫這個代碼，所以'each'循環不會綁定到每個節點的窗口/文檔？ – Adi

首先，您的語法不正確。

each將不存在於this因爲這是函數的上下文，而不是jquery知道的元素。

嘗試$(this).each這會讓你更接近。

記住Jquery.Each不能通過一個不是對象或數組的東西，所以確保你試圖達到的目標是有意義的。

你想在這裏實現什麼？

來源

2013-02-08 06:03:28 shenku

我想我不確定在插件上使用返回this.each（）。在我的情況下，我調用scroll（）所以不知道。實際上這幫助了很多 – Codex73

，他的this.each語法是正確的。 – allenhwkim

jQuery插件打破這個問題

回答

相關問題