javascript - 如何只重新加载一行

标签 javascript jquery html ajax

我有 3 列,列值不断从数据库中动态更改。 所有行的最后一列都有刷新按钮。

当我点击刷新按钮时,应该只刷新那个特定的行。

但事实并非如此。当我单击第一行刷新按钮时,它会刷新并显示警报值,但是当我单击除第一行之外的表的其他刷新按钮时,它们不会刷新。它们甚至不在警报中显示值。

这是我用过的代码:

ajax,JQuery

<script type="text/javascript">
    var id;

    function refreshRecord(value) {
        id = value;
        alert("id is " + id);
    }

    $(document).ready(function() {
        $(this).("#refresh").click(function() {
            var fileId = id;
            alert("ajax id is " + id);
            $.ajax({
                type: "post",
                url: "checkStatusAndNumRecs",
                data: {
                    fileId: fileId
                },
                success: function(data) {
                    $("#div1").html(data);
                },
                error: function(data) {
                    $("#div1").html("It was a failure !!!");
                }
            });
        });
    });
</script>

html代码

<table border="1">
    <tr>
        <td>2</td>
        <td>1</td>
        <td>3</td>
        <td>
            <input type="radio" name="submit" value="submit" onclick="refreshRecord(this.value)" id="refresh">
        </td>
    </tr>
    <tr>
        <td>7</td>
        <td>9</td>
        <td>7</td>
        <td>
            <input type="radio" name="submit" value="submit" onclick="refreshRecord(this.value)" id="refresh">
        </td>
    </tr>
    <tr>
        <td>3</td>
        <td>4</td>
        <td>6</td>
        <td>
            <input type="radio" name="submit" value="submit" onclick="refreshRecord(this.value)" id="refresh">
        </td>
    </tr>
    <tr>
        <td>9</td>
        <td>6</td>
        <td>5</td>
        <td>
            <input type="radio" name="submit" value="submit" onclick="refreshRecord(this.value)" id="refresh">
        </td>
    </tr>
</table>

最佳答案

您有多个具有相同 ID 的单选按钮。那是无效的 html。使用类代替

<input type="radio" name="submit" ... class="refresh">

并将您的 javascript 更改为

$("input.refresh").click(function() {

此外,您不应该对同一事件使用两个不同的 onclick 事件(我什至不确定它们的顺序是否正确,可能是随机的。)
您可以从您的 html 中删除 onclick="refreshRecord(this.value)" 并从您的 javascript 中删除 refreshRecord 函数并将 id 替换为 this.value$("input.refresh").click(function() { ... }) 中。

关于javascript - 如何只重新加载一行,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19006244/

相关文章:

javascript - 使用 styled-components 和 Material-UI withStyles 的 TextField 样式

javascript - jQuery deferreds - 多个 block 中的执行顺序

javascript - jQuery : How to use 2 textboxes to make 1 HTML preview

jquery - MVC jQuery 日期选择器返回 dd/MM/yyyyyyyy

javascript - 如何在没有ajax类的情况下获取span html

javascript - 两个 div 堆叠在一起——底部 div 上的链接不可点击

Javascript 分割字符串并删除前导 0

java - 将 ArrayList 转换为 JSON(在 Java 中)并使用 Javascript 访问它

javascript - 为什么这个 JQuery 下拉插件只适用于第一个下拉菜单?

javascript - JQuery 似乎不适用于服务器控制