如果我從json文件中獲取數據並將其放在html表中，如何在ajax中使用click事件

Question

我想在餐廳做一個預訂表的網站，我想在其他窗口上單擊以發送給我，然后進行預訂。 我有一個問題，因為使用Ajax我從json文件中獲取數據並將其發送到html表，但是idk如何在其中使用單擊功能。

<table id="table1" class="table table-hover container-fluid text-white" style="max-width:64%;">
                  <thead class="thead-light">
                      <tr>
                          <th scope="col">Broj stola</th>
                          <th scope="col">Pozicija</th>
                          <th scope="col">Broj stolica</th>

                      </tr>
                  </thead>
                  <tbody>

                  </tbody>
              </table>
<script>
$(document).ready(function(){
    $.ajax({

        url:"db.json",
        dataType:"json",

        success:function(data){

        $(data.stolovi).each(function(index,value){
            var stol ="<tr><td>"+value.id+"</td><td>"+
                        value.pozicija+"</td><td>"+value.brojMjesta+"</td><tr>";
            $('#table1').append(stol);
        });
        }
    });
});
</script>

Answer 1

首先，您需要定義按鈕，然后使用“單擊”事件。 見下文

    var $button = $("<button>").text("Some text !").addClass("btn btn-light")


 $button.on("click", function() {
 func1()
});


function func1() {
    $.ajax({
        url: "http://localhost:3000/[methodname]",
        type: "POST",
        data: [data as json],
        contentType: "application/json",
        dataType: "json",
        success: function(data) {
                    $(data.stolovi).each(function(index,value){
            var stol ="<tr><td>"+value.id+"</td><td>"+
                        value.pozicija+"</td><td>"+value.brojMjesta+"</td><tr>";
            $('#table1').append(stol);
        });

        }
    })
}