Question

https://i.imgur.com/WtzTa3g.png

我的错误是什么？为什么此点击功能不起作用？我做了这个功能，没有每个循环，然后那个功能正常工作，但为什么在这个地方不工作？

<html>
<head>
    <title> NG - REPEAT </title>
    <script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
</head>
<body>
    <table border="1">
        <thead>
            <tr>
                <th>ID</th>
                <th>NAME</th>
                <th>VERSION</th>
                <th>PRICE</th>
                <th>ACTION</th>
            </tr>
        </thead>
        <tbody class="tr">

        </tbody>
    </table>
    <script>

        $(document).ready(function()
        {
            $.ajax({
                url:'data.json',
                dataType:'json',
                success: function(data)
                {
                        console.log(data);
                    $.each(data.product, function(name, value)
                    {
                        var result = '<tr><td>'+name+'</td><td>'+value.name+'</td> <td>'+value.version+'</td> <td>'+value.price+'</td><td><button id="btn">Load</button></td></tr>';
                        $(".tr").append(result);
                    });
                }
            });

            $("button").click(function(){
                alert("hi");
            });
        });
    </script>

</body>

Answer 1

您需要在循环创建按钮之后添加事件侦听器，因此请执行以下操作：

$(document).ready(function()
        {
            $.ajax({
                url:'data.json',
                dataType:'json',
                success: function(data)
                {
                        console.log(data);
                    $.each(data.product, function(name, value)
                    {
                        var result = '<tr><td>'+name+'</td><td>'+value.name+'</td> <td>'+value.version+'</td> <td>'+value.price+'</td><td><button id="btn">Load</button></td></tr>';
                        $(".tr").append(result);
                    });
                    $("button").click(function(){
                     alert("hi");
                    });
                }
            });


        });

为什么这段代码中的jQuery按钮不起作用

1 个答案: