0

イベントがコンストラクターで定義されている場合に機能するこのソリューションを見てきました。

Javascript のイベント ハンドラー内のクラス メンバー変数へのアクセス

しかし、ハンドラーがプロトタイプで定義されている場合、前のソリューションの "var _self" を参照するスコープがありません。以下のようなコードで機能するバリエーションはありますか?

問題は、「スライド」ハンドラーの「this」にあります... MyView のメンバー変数ではなく、HTML 要素を参照しています。

function MyView(wrapperDiv)
{
    this.contentW = 1200;
    this.vboxW = 600;
    this.vboxH = 400;
    this.vboxX = 0;
    this.vboxY = 0;
}

MyView.prototype = {

    initHorizontalScrollBar : function ($bar)
    {
        //create the wrappers for the slider
        if($bar.find('.slider-wrap').length==0)
            $bar.append('<\div class="slider-wrap"><\div class="slider-horizontal"><\/div><\/div>');//append the necessary divs so they're only there if needed
        $bar.find('.slider-wrap').width(this.svgWidth);

        //initialize the JQueryUI slider
        $bar.find('.slider-horizontal').slider({
            orientation: 'horizontal',
            min: 0,
            max: 100,
            range:'min',
            value: 0,
            slide: function(event, ui) {

                var difference = this.contentW-this.vboxW;
                if(difference<=0)
                    return;
                this.vboxX =  (ui.value) / 100 * ( this.contentW-this.vboxW);       // 0 >= ui.value <= 100
                this.svg.setAttribute("viewBox", toViewBoxString(this.vboxX, this.vboxY, this.vboxW, this.vboxH));
                $('ui-slider-range').width(ui.value+'%');//set the height of the range element
            }
          });     


        this.sizeHScrollbar();
    }
};
4

1 に答える 1