尝试使用javascript从按钮中获取值答案

【问题标题】：Trying to get a value from a button using javascript尝试使用javascript从按钮中获取值
【发布时间】：2016-06-18 18:09:11
【问题描述】：

所以我在一张桌子上有多个删除按钮，每个按钮都有自己的唯一 ID。我试图通过 javascript 获取这个值，但我根本无法让它工作。

这是一个正常工作并加载正确 html 的部分 js（这是为每部电影运行的）：

function createRow(movie) {
        movie.NewDate = new Date(movie.ReleaseDate);
        return '<tr><td><img class="movieImage" src="' +
            movie.ImageLink +
            '" alt="' +
            movie.Title +
            ' Image" style="width:50px;height:75px">' +
            '<td>' +
            movie.Title +
            '</td><td>' +
            movie.NewDate.toLocaleDateString("en-US") +
            '</td><td><button type="button" class="removeButton" value="' + movie.DVDID + '">Delete</button></td></tr>';
    }

这是我试图检索 id 的 js：

$(document)
.ready(function () {
    var deleteButtons = $(".removeButton");
    deleteButtons.each(function (index) {
        var currentButton = $(this);
        var buttonValue = currentButton.val();
        currentButton.click(function () {
            alert(buttonValue);
        });
    });
});

我通过Click one of multiple buttons, put value in text input找到了最后一个sn-p

现在只需获得适当的警报就足够了。

【问题讨论】：

标签： javascript c# asp.net-mvc asp.net-web-api

【解决方案1】：

您是否尝试过这种方法： $("#tableId").on("click", ".removeButton", function(){ alert($(this).attr("value")); })

当点击被触发时，这个“on”将所有“.removeButton”元素与给定函数绑定。

【讨论】：

【解决方案2】：

您的 javascript 应如下所示：

$(document).ready(function () {
    var deleteButtons = $(".removeButton");
    deleteButtons.on('click', function() {
        alert($(this).attr('value'));
    });
});

此外，由于您使用 javascript 动态添加这些按钮，因此您可能需要在添加新行后重新绑定按钮单击事件。在将按钮 html 加载到 DOM 之后，也应该进行绑定。

【讨论】：

对不起，我看错了，您只需要阅读，还是点击后获得价值？
没错。而且我之前没有看到您对绑定的评论，但是我相信这个脚本是我脚本部分中的最后一个，所以页面应该在运行之前完全加载。
你得到任何空的alert 还是根本没有动作？
如果您确实收到空警报，请按照@Rahul 的建议尝试使用此alert($(this).attr('value'));。
完全没有反应。它达到了 ($document).ready 的断点，但其中没有其他内容

【解决方案3】：

由于您是动态创建按钮，因此您将无法正确访问它们，因为在启动 javascript 时它们在 DOM 中不存在。因此，为了让您能够找到按钮，您必须查看文档范围，然后找到您单击的按钮（类），如下所示：

$(document).on('click', '.removeButton', function(){
    console.log($(this).val())
})

See fiddle for complete example

【讨论】：