JavaScript 개체의 onscroll div

Question

div를 스크롤 할 때이 div를 스크롤하면 해당 기능이 활성화됩니다.

이 개체를 개체에 작성해야합니다.

이렇게 할 방법이 있습니까?

---

여기 내가 원하는 것 (예 : 작동하지 않음)을 적어주세요.

<script type="text/javascript"> 
function onsc(divName, divChange) { 
    this.play = function() { 
     window.onload = function() { 
      document.getElementById(divName).onscroll = function() { 
       this.scroll(n) 
      } 
     }; 
    } 
    this.scroll = function(n) { 
     document.getElementById(divChange).innerHTML = "you scroll!"; 
    } 
} 
c[1] = new onsc("div1", "div1_i").play(); 
</script> 

<div id="div1_i">this div will change when you scroll</div> 
<div id="div1" style="background:#C6E2FF; width:300px; height:200px; overflow-y:scroll;"> 
<p style="height:800px;">txt</p> 
</div> 

Answer 1

코드가 거의 있습니다. 몇 가지 변경을 가하고 JSFiddle을 사용했습니다.

내가 놓친 부분에 의견을 추가했습니다. 가장 중요한 점은 onscroll 이벤트에서 해당 기능을 입력하면 this의 컨텍스트가 변경된다는 것입니다.

자바 스크립트

function onsc(divName, divChange) { 
    // First of all make `this` inherit to below functions 
    var self = this; 

    this.play = function() { 
     document.getElementById(divName).onscroll = function() { 
      // Changed this to call the parent and place the correct DIV 
      self.scroll(divChange) 
     } 
    } 

    this.scroll = function (n) { 
     document.getElementById(divChange).innerHTML = "you scroll!"; 
    } 
} 

c = new onsc("div1", "div1_i").play(); 

데모

가지고 내 JSFiddle에서 보면 : http://jsfiddle.net/bJD8w/2/