クリックイベントから "this"を関数に渡す

Question

次のコードは機能しません。私はclickイベントからの "this"（これは.dot）を関数findTargetSlideOfDotに渡したいと思っていますが、私はそれをどうやってやるかについてはわかりません。おかげ

$(document).on('click', '.dot', function() { 
    var targetSlide = findTargetSlideOfDot; 
    changeSlide(targetSlide); 
}) 

function findTargetSlideOfDot() { 
    // find the slide number the user wants to see 
    var get = $.grep(this.className.split(" "), function(v, i){ 
     return v.indexOf('slide_') === 0; 
    }).join(); 
    var targetSlide = '.' + get; 

    return targetSlide; 
} 

function changeSlide(targetSlide) { 
    // hide current slide and dot 
    $('.slide.active, .dot.active').removeClass('active'); 
    $(targetSlide).addClass('active'); 
} 

Answer 1

あなたは、パラメータ実際コールその関数としてそれを渡すことができます。そして、コルトンで示さ改善も同様に適用する必要があります

$(document).on('click', '.dot', function(e) { 
    var targetSlide = findTargetSlideOfDot(e.target); 
    changeSlide(targetSlide); 
}) 

function findTargetSlideOfDot(element) { 
    // find the slide number the user wants to see 
    var get = $.grep(element.className.split(" "), function(v, i){ 
     return v.indexOf('slide_') === 0; 
    }).join(); 
    var targetSlide = '.' + get; 

    return targetSlide; 
} 

function changeSlide(targetSlide) { 
    // hide current slide and dot 
    $('.slide.active, .dot.active').removeClass('active'); 
    $(targetSlide).addClass('active'); 
} 

Answer 2

ここ

：

$(document).on('click', '.dot', function() { 
 
    var targetSlide = $(this); 
 
    changeSlide(targetSlide); 
 
}) 
 

 
function changeSlide(targetSlide) { 
 
    // hide current slide and dot 
 
    //$('.slide.active, .dot.active').removeClass('active'); 
 
    $(targetSlide).toggleClass('active'); 
 
}

.dot{ 
 
width: 100px; border: 1px solid black; 
 
padding: 10px; margin: 5px; 
 
} 
 
.dot.active{ 
 
background-color: gray; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<div class="dot">test</div>

Answer 3

は、この打撃を与えるこのようなあなたのクリック機能を変更します。

$(document).on('click', '.dot', function(e) { 
    // e.target should refer to the element with the dot class 
}) 

ここでも機能コードペンがあります：http://codepen.io/csavage1994/pen/Mppxaa

Answer 4

あなたがから選択することができます。あなたのイベントをトリガー要素を与える

$(document).on('click', '.dot', function(e) { 
    findTargetSlideOfDot(e.target); 
}); 

（クリックされた）

と：あなたが持っていた要素を与える

$(document).on('click', '.dot', function(e) { 
    findTargetSlideOfDot(e.currentTarget); 
}); 

登録されたイベントリスナー