使用ajax刷新页面的一部分 - 无法正常工作

时间:2014-04-29 09:30:56

标签: javascript jquery ajax jsp servlets

以下是我的jsp页面的代码。有一个包含两个textareas和一个按钮的表单。它有一些ajax代码来从servlet Demo 获取响应,并在textarea中打印响应而不刷新页面。

<form action="Demo">
  <textarea id="txtQuery"></textarea>
  <button type="submit" id="btnRunQuery" value="Run Query" onClick=""></button>
  <textarea id="txtResults"></textarea>
</form>

<script>
$(document).ready(function(){
  $("#btnRunQuery").click(function(){
    $.post("Demo",function(result){
      document.getElementById("txtresults").innerHTML=result;
    });
  });
});
<script>

以下是servlet 演示中的代码。

doPost(HttpServletRequest request, HttpServletResponse response)
{
  String query=request.getParameter("txtQuery");
  //The query is processed and the result is stored in a string solution.
  response.getWriter.print(solution);
}

单击按钮后。结果由servlet发送到jsp页面,但它们没有在textarea中打印。打开一个新的空白页面,结果显示在那里。我无法理解此代码中的问题。帮助将不胜感激!

1 个答案:

答案 0 :(得分:1)

使用e.preventDefault()

停止阻止默认提交操作

希望您的网址为/Demo

$("#btnRunQuery").click(function(e){
    e.preventDefault();
    $.post("/Demo",null,function(result){
      document.getElementById("txtresults").innerHTML=result;
    });
  });