Question

如果条件为true，我正在尝试使链接工作，我发送jQuery.get()并检查链接是否应跳转到下一页。

我正在使用以下代码：

<script type="text/javascript">
    var jq = jQuery.noConflict();
    function checkDoubleSubmit() {
        jq(function() {
            jq.get("/checkDoubleSubmit",
                    function(data) {
                        if(data == null) {
                            return true;
                        }
                        else {
                            alert("double submit is not allowed");
                            return false;
                        }
                    }
            );
        });
    }
</script>


<a href="<c:url value="/submit" />" onclick="return checkDoubleSubmit();">check double submit</a>

即使data不是null，页面也会跳转到下一页。有人能帮助我理解我在这里做错了什么吗？

感谢。

Answer 1

那是因为ajax call是asynchronous。它不会等待ajax响应。为此，要么在ajax调用中包含async = fasle。或更改preventDefault。

或更改以下代码

<a href="#" id="mylink" for="<c:url value="/submit" />" onclick="checkDoubleSubmit();">check double submit</a>

<script type="text/javascript">
    var jq = jQuery.noConflict();
    function checkDoubleSubmit() {
        jq(function() {
            jq.get("/checkDoubleSubmit",
                    function(data) {
                        if(data == null) {
                            window.location = jq("a#mylink").attr("for");
                        }
                        else {
                            alert("double submit is not allowed");
                        }
                    }
            );
        });
    }
</script>

Answer 2

您永远不会从checkDoubleSubmit函数返回任何真/假值。您的return语句仅返回jq.get使用的匿名函数。

你可以这样做：

<script type="text/javascript">
    var jq = jQuery.noConflict();
    function checkDoubleSubmit() {
        var doubleCheckResult;
        jq(function() {
            jq.get("/checkDoubleSubmit",
                    function(data) {
                        if(data == null) {
                            doubleCheckResult = true;
                        }
                        else {
                            alert("double submit is not allowed");
                            doubleCheckResult = false;
                        }
                    }
            );
        });
        return doubleCheckResult;
    }
</script>

但是，这只会让你开始。请参阅dku关于原因的答案，然后查看How can I get jQuery to perform a synchronous, rather than asynchronous, Ajax request?以了解有关如何实施它的详细信息。

Answer 3

无论您使用checkDoubleSubmit()获得什么，

get()都不会返回值。 checkDoubleSubmit()的执行在您通过get()获取AJAX数据之前结束，因为它是异步调用。以这种方式处理它不会取得成功。

执行此操作的一种方法是从checkDoubleSubmit()返回false，然后在get()的回调函数中，如果数据正常并且您希望提交通过，请提交再次使用JavaScript表示，这次没有任何检查，以便立即提交。

Answer 4

我使用以下代码完成了这项工作：

<script type="text/javascript">
    var jq = jQuery.noConflict();
    function checkDoubleSubmit(obj) {
        var checkDoubleSubmitResult;
        jq.ajax({
            url:        "/checkDoubleSubmit",
            success:    function(data) {
                                if(data == null) {
                                    checkDoubleSubmitResult = true;
                                }
                                else {
                                    alert("double submit is not allowed");
                                    checkDoubleSubmitResult = false;
                                }
                            },
            async:      false,
            dataType:   "json"
        });
        return checkDoubleSubmitResult;
    }
</script>
<a href="<c:url value="/submit" />" onclick="return checkDoubleSubmit(this);">check double submit</a>

javascript返回jQuery.get（）不起作用

4 个答案: