Question

原始网址为http://localhost:8080/appname/help.action 此页面包含表单

<div id="message"></div>

<form id="help_form" name="help_form" onsubmit="return validate_help_form()">
    ...
    <input type="submit" value="Submit" />
</form>

脚本

function validate_help_form() {

    if ( ... ) {
            ...
            return false;
    }

    $.ajax({

        url : 'http://localhost:8080/appname/question',
        type : 'POST',
        dataType : 'html',
        success : function(result) {    
            console.log('^^^^^^^^^');     
            $('#message').text(result);
        },
        error : function(xhr, ajaxOptions, thrownError) {
            alert('Unable to receive result. ' + thrownError);
        },
    });

}

servlet非常简单

logger.info("-----------");

try {
    response.getWriter().append( "a servlet result" );
} catch (IOException e) {
    e.printStackTrace();
}

问题是当ajax请求有效时，原始页面再次由路径“http://localhost:8080/appname/help.action进行搜索。但我想用ajax结果更新字段消息。所以在控制台中我得到了

^^^^^^^^^
Navigated to http://localhost:8080/my-mates-ajax/help.action?username=...

Answer 1

尝试使用此

<form onsubmit="event.preventDefault(); return validate_help_form();">

基本上你需要首先阻止表单提交然后你可以执行操作。否则，表格将与ajax请求一起提交。

JavaScript更新网页而不是更新字段

1 个答案: