javascript返回jQuery.get()不起作用

时间:2012-01-22 08:52:08

标签: javascript jquery onclick

如果条件为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,页面也会跳转到下一页。 有人能帮助我理解我在这里做错了什么吗?

感谢。

4 个答案:

答案 0 :(得分:3)

那是因为ajax callasynchronous。它不会等待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>

答案 1 :(得分:1)

您永远不会从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?以了解有关如何实施它的详细信息。

答案 2 :(得分:1)

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

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

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

答案 3 :(得分:0)

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

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