Question

我需要在页面上有多个按钮（通过PHP循环创建） - 没有固定数量的按钮，因为每个显示的记录都有一个。我想在点击时使用javascript获取该按钮的值。

到目前为止html看起来像：

<button id="update[0]" value="test">Update</button>
<button id="update[1]" value="test">Update</button>
<button id="update[2]" value="test">Update</button>
etc....

我的脚本是：

$(document).ready("#update").click(function() {
    var updateId = $("#update").val
    alert(updateId);
});

到目前为止，脚本检测到点击任何#update[]按钮的时间，但我如何知道特定按钮的索引以获取值（即如果点击#update[38]我怎么知道它的？ #update[38]所以我可以找到该特定按钮的值吗？

感谢。

Answer 1

您不希望将文档链接起来就像返回文档一样。

$(document).ready("#update").click(function() {

所以你正在捕获document.click而不是button.click所以当你引用$（this）.val（）时，你将获得不存在的document.value。

应该是：

$(document).ready(function () {
    $("button").click(function () {
        //no reason to create a jQuery object just use this.value
        var updateId = this.value;
        alert(updateId);
    });
});

http://jsfiddle.net/SeanWessell/2Lf6c3fx/

Answer 2

我相信你打算用

var updateId = $("#update").val()

使用jQuery，您可以使用$(this).val()
您还可以使用.text()
使用纯Javascript，如果按钮具有值属性

.value

请参阅：Javascript Get Element Value

Answer 3

使用“this”关键字。

$(document).ready("#update").click(function() {
    var updateId = $(this).val();
    alert(updateId);
});

javascript中的 this 关键字允许您引用与之交互的对象的特定实例。

另外，在val。

的末尾添加“（）”

Answer 4

我建议以下

file:

使用课程来应用点击功能。

<button id="0" class="updatebutton" value="test">Update</button>
<button id="1" class="updatebutton" value="test">Update</button>
<button id="2" class="updatebutton" value="test">Update</button>

并使用id指定按钮的索引。

Answer 5

诀窍是让所有按钮都是同一个类，然后使用$（this）找出点击的按钮。一旦你知道了按钮，就可以检查它的任何属性，如id，value或name。

$(function() {

  $(".xx").on("click", function(evt) {
    var clicked_button = $(this);
    alert(clicked_button.attr("value"));
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>


<button id="update_1" class="xx" value="test1">Button 1</button>
<button id="update_2" class="xx" value="test2">Button 2</button>
<button id="update_3" class="xx" value="test3">Button 3</button>

Answer 6

你的javascript存在一些问题。

您正在将onClick附加到文档中！函数就绪返回文档。

错：

$(document).ready("#update").click(function() {

右：

$(document).ready(function () { $(valid_selector).click...

您正在尝试使用$（'#update'）重新获取按钮，其中1不提取任何内容，如果确实返回了所有按钮，则返回2。因此，在click函数的范围内使用$（this）代替单击按钮。

以下是您的javascript更正：

https://jsfiddle.net/ffkekpmh/

//When the document is ready call this function
$(document).ready(function () {

    //Select all buttons whoes id starts with update
    //https://api.jquery.com/category/selectors/attribute-selectors/
    $('button[id^="update"]').click(function() {

        //Store the id attribute from the clicked button
        var updateId = $(this).attr("id");

        //Store the value attribute from the clicked button
        var value = $(this).attr("value");


        alert("You clicked button:"+updateId+" with value: "+value);

    });

});

使用javascript查找多个按钮的值

6 个答案: