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

获取按钮的值最后点击。

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> 

在jQuery的

，你可以做这样的 JS代码

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

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

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

Working fiddle here

Answer 6

试试这个代码：

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