den Button Text der gedrückten Taste innerhalb von einem Elemente

Question

Ich habe zwei Tasten in einer Spanne

<span class="somespan"> 
<button type="button">left</button> 
<button type="button">right</button> 
</span> 

I gesetzt habe ein .on Ereignis bis zu triggern, wenn eine aktiviert wird.

$('.somespan').on("mousedown tap", function() { 
direction = ($(this).text()); 
}) 

Dies ergibt das Ergebnis leftright, da es den Schaltflächentext für alle Schaltflächen bereitstellt. Wie bekomme ich nur den Schaltflächentext für die angeklickte Schaltfläche?

Answer 1

Das Problem ist, weil Sie das Ereignis an den span angebracht haben. Für this beziehen sich die Elemente auf button, Sie müssen das Ereignis stattdessen an dieses Element anhängen. Versuchen Sie folgendes:

$('.somespan button').on("mousedown tap", function() { 
 
    direction = $(this).text(); 
 
    console.log(direction); 
 
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<span class="somespan"> 
 
    <button type="button">left</button> 
 
    <button type="button">right</button> 
 
</span>

Alternativ, wenn Sie haben die span zu wählen, dann können Sie das klickten Element finden, indem event.target statt this verwenden. Beachten Sie die e in den Handler-Funktionsparameter.

$('.somespan').on("mousedown tap", function(e) { 
 
    direction = $(e.target).text(); 
 
    console.log(direction); 
 
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<span class="somespan"> 
 
    <button type="button">left</button> 
 
    <button type="button">right</button> 
 
</span>

Answer 2

Sie haben den Hörer auf die Tasten attatch :)

$('button').on("mousedown tap", function() { 
    direction = ($(this).text()); 
}) 

oder in der Spanne

$('.somespan').on("mousedown tap","button", function() { 
    direction = ($(this).text()); 
}) 

Answer 3

Try

$('.somespan button').on("mousedown tap", function() { 
direction = ($(this).text()); 
}) 

In Ihrem Fall das Hinzufügen, den Sie hinzufügen MouseDown- Ereignis auf die Spanne statt der Taste

Answer 4

Ihre Wähler ändern $('.somespan')-$('.somespan>button') zielen auf die spezifischen button.

$('.somespan>button').on("mousedown tap", function() { 
 
    var direction = $(this).text(); 
 
    console.log(direction) 
 
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<span class="somespan"> 
 
    <button type="button">left</button> 
 
    <button type="button">right</button> 
 
</span>