0

我正在尝试从 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 的数据，但我也从它的 GET 视图中获得此代码...

<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>

当我按下支付按钮时，它什么也没做：/

请帮助完成这项工作。

多谢你们

4

2 回答 2

1

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

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

至

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

这会将绑定附加到窗口，这甚至对加载窗口后添加的元素也有效。

于 2013-10-23T16:25:26.630 回答
0 
$(".pay").click(function(){...

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

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

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

});
于 2013-10-23T16:24:54.410 回答