javascript - 绑定(bind)两个 JQuery 和 ajax 函数

Question

我有以下 JQuery/AJAX 代码:

 <script>


    $('.warning-dialog').click(function () {
        alert($(this).data("id"));
    });

    $(function () {
        //twitter bootstrap script
        $("button#delete").click(function () { 
            $.ajax({
                type: "GET",
                url: "deleteArticleType.php",
                data: { 'typeID': $('.warning-dialog').data("id") },
                success: function (msg) {
                    $("#thanks").html(msg)
                    $("#form-content").modal('hide');
                },
                error: function () {
                    alert("failure");
                }
            });
        });
    });
</script>

第一个函数获取按钮的数据标识。第二个函数调用 PHP 页面，使用 GET 方法应该从第一个函数中获取值。

我试过上面的代码，但没有用。

我的问题是为什么以及如何解决？

Answer 1

如果这是两个独立的事件，在时间上断开连接，并且您想存储第一次点击的值，然后在第二次点击中使用它，那么您必须将其存储在某个地方。有多种选择，最简单的是变量。

$(function () {
    var lastClickId;
    $('.warning-dialog').click(function () {
        lastClickId = $(this).data("id");
    });

    //twitter bootstrap script

    // FIXME: you need to add logic here for what to do if lastClickId isn't set yet
    // or create a default behavior in that case
    $("button#delete").click(function () { 
        $.ajax({
            type: "GET",
            url: "deleteArticleType.php",
            data: { 'typeID': lastClickId },
            success: function (msg) {
                $("#thanks").html(msg)
                $("#form-content").modal('hide');
            },
            error: function () {
                alert("failure");
            }
        });
    });
});

由于看起来您需要在第二次点击可以进行操作之前发生第一次点击，那么您可能应该修改 UI 以使用不同类型的控件，或者您需要添加一些错误处理，如果用户没有按正确的顺序点击。