Question

我正试图从ajax get发布ajax。以下是我正在使用的代码：

$(window).load(function() {
    $.ajax({
        url: "/masterScreen/ajaxdealerpaid/{{$id}}", 
        type: "GET", 
        data: {},
        success: function(data) {
            document.getElementById("dealerPaid").innerHTML=data; 
        }
    });
});

然后我正在尝试：

$(".pay").click(function(){
            alert('Order #'+id+' has been marked as paid for '+amountPaid+'');

    var id = $(this).attr('data-id');
    var amountPaid = $("#payAmount_"+id).val()

    $.ajax({
        url: "/masterScreen/dealermarkpaid/"+id+"/"+amountPaid, 
        type: "POST", 
        data: {},
        success: function(data) {
            alert('Order #'+id+' has been marked as paid for '+amountPaid+'');
            location.reload();
        }
    });
});

我的HTML是......

<table style="width: auto;" class="table table-striped table-condensed" border="0" cellspacing="0" cellpadding="0">
            <thead class="navbar-static-top" style="display:block; margin:0px; cell-spacing:0px; left:0px;">
              <tr>
                <th class="span2">Quote ID</th>
                <th class="span4">Customer name</th>
                <th class="span4">Connection date</th>
                <th class="span4">BDM</th>
                <th class="span4">Owed</th>
                <th class="span4">Amount</th>
                <th class="span2"></th>
              </tr>
            </thead>
            <tbody id="dealerUnpaid" style="display:block; overflow:auto; max-height:400px;">

            </tbody>
            <tfoot id="dealerUnpaidtot" class="navbar-static-top" style="display:block; margin:0px; cell-spacing:0px; left:0px; font-weight: bold;">

            </tfoot>
        </table>

它显示来自第一个javascript的数据，但我也从视图中获取了这个代码来自......

<td class="span4"><input type="text" placeholder="Enter Amount" class="payAmount" data=name="amount" data-id="{{$unpaid->id}}" id="payAmount_{{$unpaid->id}}"></td>

<td class="span2"><input type="button" class="btn pay" value="Pay" data-id="{{$unpaid->id}}"></td>

当我按下“付款”按钮时，它不会执行任何操作：/

任何有助于完成这项工作的帮助都会很好。

谢谢你们

Answer 1

如果我理解正确，您将使用AJAX加载标记（包括.pay元素），然后尝试将某些内容绑定到.pay元素的click事件。由于在您进行绑定时页面中不存在.pay元素，因此绑定不起作用。更改绑定：

$('.pay').click(function(){

到

$(window).on('click', '.pay', function(){

这会将绑定附加到窗口，这样甚至可以在加载窗口后添加的元素上起作用。

Answer 2

$(".pay").click(function(){...

仅适用于已创建具有类付费的元素，它不能通过ajax调用对新创建的元素起作用。您可以使用委托功能来处理新创建的元素

$("body").delegate(".pay","click",function(event){

    event.preventDefault(); // prevent default handlings
    alert("Test");
    //do other code...

});

来自ajax的ajax帖子得到

2 个答案: