jQueryのボタン - ゲット押す値

Question

私はこのようになりますシンプルなjQueryのUIのボタンセットを持っている...

<div class="buttons"> 
    <button id="button1" class="ui-button ui-widget ui-corner-all" value="orange">Orange</button> 
    <button id="button2" class="ui-button ui-widget ui-corner-all" value="banana">Banana</button> 
    <button id="button3" class="ui-button ui-widget ui-corner-all" value="apple">Apple</button> 
</div> 

は、どのように私は押されたボタンの値を得ることができますか？誰かが私の方向に私を指すことができる例がありますか？

Answer 1

あなたはボタン要素のイベントリスナーを追加することができます。

$('button').click(function() { 
    var value = this.value; 
}); 

は、私はそれが役に立てば幸いこのJSFiddle Link

を確認してください。

Answer 2

var buttons = $(".buttons > button"); 
 
buttons.on('click',function(){ 
 
    console.log(this); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="buttons"> 
 
    <button id="button1" class="ui-button ui-widget ui-corner-all" value="orange">Orange</button> 
 
    <button id="button2" class="ui-button ui-widget ui-corner-all" value="banana">Banana</button> 
 
    <button id="button3" class="ui-button ui-widget ui-corner-all" value="apple">Apple</button> 
 
</div>

Answer 3

document.querySelectorAll('.ui-button').forEach(function(item){ 
    item.addEventListener('click', function(event) { 
    var target = event.target.value; 
    console.log(target); 
    }); 
}); 

Answer 4

ボタンの値が最後にクリックを取得します。 jQueryので

ここ

document.ready(function(){ 
    var button = $(".ui-button.ui-widget.ui-corner-all"); 
    button.click(function(){ 
     buttonValue = $(this).val(); 
    }); 
}); 

Answer 5

実施例である

Htmlの

<div class="buttons"> 
    <button id="button1" class="ui-button ui-widget ui-corner-all" value="orange">Orange</button> 
    <button id="button2" class="ui-button ui-widget ui-corner-all" value="banana">Banana</button> 
    <button id="button3" class="ui-button ui-widget ui-corner-all" value="apple">Apple</button> 
</div> 

<span id="buttonValue"></span> 

あなたは

$('button').click(function(){ 

     var buttonValue = $(this).val(); 

     $('#buttonValue').text(buttonValue); 
     }); 

この JSコードのようにそれを行うことができます

Answer 6

このコードを試してみてください。

$('button').click(function() { 
    alert($(this).val()) 
});