📌  相关文章
📜  如何在JSP中使用ajax在同一页面上显示另一个页面的搜索结果?

📅  最后修改于: 2021-11-24 04:51:34             🧑  作者: Mango

在这个例子中,我们正在创建一个搜索栏,在 JSP 中使用 ajax 在同一页面上显示结果。 AJAX 代表异步 JavaScript 和 XML。其中 Ajax 主要用于在同一网页上显示另一个网页内容,而无需刷新页面。您可以在此处阅读有关 ajax 技术的更多信息。

方法:
我们使用 JQuery 就绪函数来确保我们的 JavaScript 在页面加载之前不会执行。在就绪函数内部,
我们使用id="#sub"执行一个简单的点击事件,它是应该执行操作的提交底部的 id。

var fn=$("#user_input").val();
$.post("SearchResult.jsp", {n3:fn}, function(data){    
$("#msg").html(data); 
});

在上面的代码中,

  • $(“user_input”).value():从文本字段中获取输入值,其中user_input是 id。
  • $.post(“SearchResult.jsp”, {n3:fn}, 函数(data){}):在这种情况下, fn值作为参数传递到index.jsp页面,该页面从数据库中搜索结果并显示在同一页面上. fn值可以通过使用request.getParameter("n3")index.jsp中获取。
  • $(“#msg”).html(data): msg 是 div 标签的 id 意思是,它只会在 div 标签内显示结果。

例子:

  • 索引.html
    
    
      
    
        search result of another page on 
          same page using ajax in JSP
        
        
    
      
    
        
            
                

                  GeeksforGeeks

                

    Enter Your Name

                                                   
        
             
                                            
      
  • 索引.jsp
    
      
    
        
            <%               String uname=request.getParameter("n3");          out.println("Welcome "+uname);          %>     
      

输出
前:

后: