发布请求完成后,意外的网址会发生变化

时间:2016-03-14 06:02:47

标签: javascript jquery html web

我正在编写一个简单的Web服务,并且在Web UI上(url是“localhost:9001”),有一个触发函数indexIt的按钮,它引发一个POST请求,服务器用json响应。

<button type="submit" id="indexButton" class="btn btn-primary" onclick="indexIt()">Index</button>

相关代码是:

function displayResponse(msg) {
    var shown = JSON.stringify(msg, null, 2);
    $(hintTextSelector).text(shown);
}

function indexDoneHint(response) {
    console.log(JSON.stringify(response));
    displayResponse(response);
}

function getLOptions() {
    return {
        "stem": $("#cb-index-stem").is(":checked"),
        "ignore": $("#cb-index-ignore").is(":checked"),
        "swDict": $("#lb-index-stopwords").val()
    }
}

function indexIt() {
    var indexOptions = getLOptions();
    var privateParam = {
        "method": "POST",
        "url": _getUrl("indexDoc"),
        "data": JSON.stringify(indexOptions)
    };
    $.extend(privateParam, commonParam);
    $.ajax(privateParam).done(indexDoneHint).error(onError);
}

问题是,当我按下按钮触发请求时,网址将更改为“localhost:9001 /?” (尾随/?)已添加。

奇怪的是,当我使用开发者控制台并调用indexIt()时,页面仍为“localhost:9001”

2 个答案:

答案 0 :(得分:1)

只需将按钮设为简单按钮而不是提交按钮,键入=&#34;按钮&#34;

<button type="button" id="indexButton" class="btn btn-primary" onclick="indexIt()">Index</button>

OR

<input type="button" id="indexButton" class="btn btn-primary" onclick="indexIt()">Index</button>

因为当您将按钮设置为提交时,它会将您的页面提交给使用Form标签编写的操作。

答案 1 :(得分:1)

如果您在表单中使用按钮<button>,则点击它会自动提交表单。 而不是按钮标签使用输入标签,即 <input type="button" id="indexButton" class="btn btn-primary" onclick="indexIt()" value="Index It" />

或使用return keyword

  1. <button type="submit" id="indexButton" class="btn btn-primary" onclick="return indexIt()" >Index</button>

  2. 在你的javascript函数“indexIt()”中最后使用“return false”,这样它就会运行你的js代码并停止执行。

  3.     function indexIt() {
        var indexOptions = getLOptions();
        var privateParam = {
            "method": "POST",
            "url": _getUrl("indexDoc"),
            "data": JSON.stringify(indexOptions)
        };
        $.extend(privateParam, commonParam);
        $.ajax(privateParam).done(indexDoneHint).error(onError);
        
       return false;
    }