如何在JSP中使用ajax在同一页面显示另一个页面的搜索结果
在这个例子中,我们在JSP中使用ajax创建一个搜索栏,在同一页面上显示结果。AJAX是Asynchronous JavaScript and XML的缩写。其中Ajax主要用于在同一网页上显示另一个网页的内容,而不需要刷新页面。你可以在这里阅读更多关于Ajax技术的信息。
步骤:
我们使用JQuery ready函数,以确保我们的JavaScript在页面加载前不会执行。在ready函数中。
我们执行一个简单的使用点击事件,id=”#sub”,它是提交底层的id,应该对其进行操作。
在上面的代码中,
$("user_input").value()
。从文本字段获取输入值,其中user_input是id。$.post("SearchResult.jsp", {n3:fn}
,function(data){}
)。在这种情况下,fn值被作为参数传入index.jsp页面,从数据库中搜索结果并显示在同一页面上。fn值可以通过使用request.getParameter(“n3”)在index.jsp获得。$("#msg").html(data)
: msg是div标签的id,意味着它将只在div标签内显示结果。
示例:
- index.html
- index.jsp
输出
Before:
After: