Question

此AJAX仅执行一次，如果单击一次，则AJAX不适用于其他“详细信息”按钮。这是什么原因？

按钮：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<td><a id="detay-menu-toggle-right" data-paketno="3512" href="#">Details</a></td>
<td><a id="detay-menu-toggle-right" data-paketno="3841" href="#">Details</a></td>

使用Javascript：

$(document).ready(function(){
    $("#detay-menu-toggle-right").click(function(){
        $("#detay-wrapper-right").toggleClass("active");
        var paketnosu = $(this).data("paketno");
        var dataString = 'paketDetayi='+paketnosu;
        $.ajax({
            data: dataString,
            url: 'test3.php',
            type: 'POST',
            success: function (data) {
                $("#detay-sidebar-wrapper-right").html(data);
            },
            error:
                function() {
                    alert('Not OKay');
                }
        });
    });
});

Answer 1

使用类而不是ID，页面上只能有一个具有特定ID的元素，而jQuery只会对它遇到的页面上的第一个元素起作用。

$(document).ready(function(){
    $(".detay-menu-toggle-right").click(function(){
        $("#detay-wrapper-right").toggleClass("active");
        var paketnosu = $(this).data("paketno");
        var dataString = 'paketDetayi='+paketnosu;
        $.ajax({
            data: dataString,
            url: 'test3.php',
            type: 'POST',
            success: function (data) {
                $("#detay-sidebar-wrapper-right").html(data);
            },
            error:
                function() {
                    alert('Not OKay');
                }
        });
    });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<td><a class="detay-menu-toggle-right" data-paketno="3512" href="#">Details</a></td>
<td><a class="detay-menu-toggle-right" data-paketno="3841" href="#">Details</a></td>

只有一次执行--AJAX

1 个答案: