个人中心
gpt4 book ai didi

java - JSP + Ajax 不起作用

转载 作者：行者123 更新时间：2023-11-30 04:17:22 25 4
gpt4 key购买 nike

目标:如果我输入电子邮件 ID，则在 html 表单中它必须将请求发送到 jsp，在 jsp 中执行逻辑并必须打印(以 html 表单)无论电子邮件是否可用。我有以下代码。请帮我看看我做错了哪一部分。

CreateAccount.html

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<script type="text/javascript" src="emailStore.js"></script>
</head>
<body onload="process()">
    <form name="login">
        <table align="center">
            <tr>
                <td>Email*</td>
                <td><input type="text" name="userinput" id="userinput"/></td>
                <td><div id = "underInput"></div></td>
            </tr>
            <tr>
                <td>Password*</td>
                <td><input type="password" name="pswrd" /></td>
            </tr>
            <tr>
                <td>Repeat Password*</td>
                <td><input type="password" name="pswrd1" /></td>
            </tr>
            <tr>
                <td>First Name*</td>
                <td><input type="text" name="userid" /></td>
            </tr>
            <tr>
                <td>Last Name*</td>
                <td><input type="text" name="userid" /></td>
            </tr>
            <tr>
                <td>Phone Number</td>
                <td><input type="text" name="userid" /></td>
            </tr>
        </table>
        <div style="text-align: center">
            <input type="submit" value="Create Account"/>
        </div>
    </form>

</body>
</html>

javascript 文件中的 ajax 部分。 emailStore.js

var xmlHttp = createXmlHttpRequestObject();

function createXmlHttpRequest()
{
    var xmlHttp;

    if(window.ActiveXObject)
    {
        try
        {
            xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
        }
        catch(e)
        {
            xmlHttp = false;
        }
    }
    else
    {
        try
        {
            xmlHttp = new ActiveXObject();
        }
        catch(e)
        {
            xmlHttp = false;
        }
    }
    if(!xmlHttp)
    {
        alert("can't create that object");
    }
    else
    {
        return xmlHttp;
    }
}

function process()
{
    if(xmlHttp.readyState==0 || xmlHttp.readyState==4)
    {
        email = encodeURIComponent(document.getElementById("userinput").value);
        xmlHttp.open("GET", "emailStore.jsp?email=" + email, true);
        xml.onreadystatechange = handle.ServerResponse;
        xmlHttp.send(null);
    }
    else
    {
        setTimeout('process()', 1000);
    }
}

function handleServerResponse()
{
    if(xmlHttp.readyState==4)
    {
        if(xmlHttp.status==200)
        {
            xmlResponse = xmlHttp.responseXML;
            xmlDocumentElement = xmlResponse.documentElement;
            message = xmlDocumentElement.firstChild.data;
            document.getElementById("underInput").innerHTML = '<span style = "color:blue">' + message + '</span>';
            setTimeout('process()',1000);
        }
        else
        {
            alert('Something went Wrong');
        }
    }
}

jsp 文件中的逻辑部分 - emailStore.jsp

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<%@ page import="java.util.ArrayList"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Insert title here</title>
</head>
<body>

    <%
        String email = request.getParameter("userinput");
        ArrayList<String> emails = new ArrayList<String>();
        emails.add("something@gmail.com");
        if (emails.contains(email)) {
            out.println("Email already taken!");
        } else {
            out.println("Email available");
        }
    %>

</body>
</html>

最佳答案

我会建议您以下几点:

  1. Use library JQuery;
  2. Use Servlet instead of the JSP;
  3. Keep a list in the session;
  4. Do not use a tabular layout. Instead, use div- layers, and cascading style sheets.

这是一个简单的例子，前端部分是..

<head>
...
<script>
    $(document).ready(function() {                        
       $('#submit').click(function(event) {  
          var input=$('#userinput').val();
          $.get('ActionServlet',{userinput:input},function(responseText) { 
             $('#underInput').text(responseText);         
          });
        });
    });
</script>
...
</head>
<body>
...
<form id="form1">
...
Email
<input type="text" id="userinput"/>
<input type="button" id="submit" value="Submit"/>
<br/>
<div id="underInput">
</div>
...
</form>
...
</body>
</html>

..和服务器端 -

...
public class ActionServlet extends HttpServlet {
   private static final long serialVersionUID = 1L;

   public ActionServlet() {
      // TODO Auto-generated constructor stub
   }

   protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
      String answer = "Something went Wrong";
      String userinput = request.getParameter("userinput").toString();

      HttpSession httpSession = request.getSession(true);
      if(httpSession.isNew()) {
         httpSession.setAttribute("sessionVar", new ArrayList<String>());
      }

      List<String> arrayList = (ArrayList<String>)httpSession.getAttribute("sessionVar");
      if(userinput != null && !userinput.equals("")) {
         if(arrayList.contains(userinput)) {
            answer = "Email already taken!";
         } else {
            arrayList.add(userinput);
            answer = "Email available";
         }
      }

     response.setContentType("text/plain");  
     response.setCharacterEncoding("UTF-8"); 
     response.getWriter().write(answer); 
   } 
   ...

关于java - JSP + Ajax 不起作用，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/18034431/

25 4 0
文章推荐： c++ - 如何将指向数组的指针初始化为成员变量
文章推荐： c++ - C++中的逗号运算符
文章推荐： c++ - 如何在 C++ 中调试 WM_PAINT 中的代码？
文章推荐： java - 如何检查节点是否已从内容存储库中删除？
行者123
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com