複数の要素に呼び出されたページネーションは、最後のものだけを呼び出す

Question

複数回呼び出されたときに呼び出されるページネーションスクリプトがあります。呼び出された最後の要素に対してのみ呼び出されます。なぜこのようなことが起こっているのでしょうか？

<script> 
$('.calendar-nagyhaz').scrollPagination(); 
$('.calendar-felso').scrollPagination(); 
</script> 

このように呼び出すと、「.calendar-felso」だけが影響を受けます。あなたがここにグローバル変数を設定している

(function($) { 

$.fn.scrollPagination = function(options) { 

    var settings = { 
     nop  : 1, // The number of posts per scroll to be loaded 
     offset : 0, // Initial offset, begins at 0 in this case 
     error : '', // When the user reaches the end this is the message that is 
            // displayed. You can change this if you want. 
     delay : 500, // When you scroll down the posts will load after a delayed amount of time. 
         // This is mainly for usability concerns. You can alter this as you see fit 
     scroll : false // The main bit, if set to false posts will not load as the user scrolls. 
         // but will still load if the user clicks. 
    } 

    // Extend the options so they work with the plugin 
    if(options) { 
     $.extend(settings, options); 
    } 

    // Some variables 
    $this = $(this); 
    $settings = settings; 
    var offset = $settings.offset; 
    var busy = false; // Checks if the scroll action is happening 
         // so we don't run it multiple times 

    function getData(add) { 

      if (add == true) {offAdd = offset+$settings.nop; } else { offAdd = offset-$settings.nop; } 
      offset = offAdd; 
      lakas = $this.attr("data-lakas"); 
      alert(lakas); 

      // Post data to ajax.php 
      $.post('ajax.php', { 

       action  : 'scrollpagination', 
       number  : $settings.nop, 
       offset  : offset, 
       lakas   : lakas 

      }, function(data) { 

        // Append the data to the content div 
        $this.find(".calendar").empty().append(data); 

        // No longer busy! 
        busy = false; 

      }); 

      $.post('month.php', { 

       action  : 'scrollpagination', 
       number  : $settings.nop, 
       offset  : offset 

      }, function(data) { 

        offset = offAdd; 

        // Append the data to the content div 
        $this.find('.cal-month').empty().append(data); 

        // No longer busy! 
        busy = false; 

      }); 

     } 

     //Run it for the first time 
     getData(); 

     // Also content can be loaded by clicking the loading bar/ 
     $this.find('.cal-prev').click(function() { 

      if(busy == false) { 
       busy = true; 
       getData(false); 
      } 

     }); 

     $this.find('.cal-next').click(function() { 

      if(busy == false) { 
       busy = true; 
       getData(true); 
      } 

     }); 
} 

})(jQuery); 

Answer 1

：

は

$this = $(this); 
$settings = settings; 

それは本当に意味：あなたはおそらく意図は何

window.$this = $(this); 
window.$settings = settings; 

は次のとおりです。

var $this = $(this); 
var $settings = settings; 

ページネーションスクリプトは次のようになります

一つのバグ、バグがあるかもしれません。ここで

---

すぎて、これらはすべてグローバルです：

 if (add == true) {offAdd = offset+$settings.nop; } else { offAdd = offset-$settings.nop; } 
     offset = offAdd; 
     lakas = $this.attr("data-lakas"); 

offAdd、は、ラカスをオフセット、これらは、それらのローカル変数にするために彼らの前にvarを必要としています。

この関数のインスタンスが2つあると、それぞれの変数が上書きされます。 （それらはグローバルであるため）