JavaScript验证在HTML表单上不起作用_Javascript

JavaScript验证在HTML表单上不起作用

javascript

JavaScript验证在HTML表单上不起作用,javascript,Javascript,我想验证我的jsp表单下面给出了我的test.jsp页面 <%@ page import="java.util.Date" %> <%@ page language="java" contentType="text/html; charset=ISO-8859-1" pageEncoding="ISO-8859-1"%> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://w

我想验证我的jsp表单

下面给出了我的test.jsp页面

<%@ page import="java.util.Date" %>
<%@ page language="java" contentType="text/html; charset=ISO-8859-1" pageEncoding="ISO-8859-1"%>
<!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>Test</title>
<script>
    function validateForm() {
        var address = document.getElementById("txtAddress");
        alert("Address : " + address);
        if (address == null || address == "") {
            alert("Enter Address");
            return false;
        }

        var city = document.getElementById("txtCity");
        if (city == null || city == "") {
            alert("Enter City");
            return false;
        }
    }
</script>
</head>
<body>
    <form name="TestForm1" action="loginServlet" method="post" onsubmit="return validateForm();">
        <table>
            <tr>
                <td>Address :</td>
                <td><input type="text" name="txtAddress" value="${reqObj.address}" /></td>
                <td>City :</td>
                <td><input type="text" name="txtCity" value="${reqObj.city}" /></td>
            </tr>
            <tr align="left">
                <td colspan="4"><input type="submit" value="Submit" /></td>
            </tr>
        </table>
        <%
            String createdDate = "";
            Date dt = new Date();
            createdDate = dt.toString();
            System.out.println("currentTime>>>>" + createdDate);
        %>
    </form>
</body>
</html>


测验
函数validateForm（）{
var address=document.getElementById（“txtAddress”）；
警报（“地址：”+地址）；
如果（地址==null | |地址==“”）{
警报（“输入地址”）；
返回false；
}
var city=document.getElementById（“txtCity”）；
如果（城市==null | |城市==“”）{
警报（“进入城市”）；
返回false；
}
}
地址:
城市：

问题是,，当运行此项目时，我的test.jsp表单显示为空地址字段，当我单击提交按钮时，警报显示“地址：null”

但当我在地址文本框字段中写入一些值时，我再次单击提交按钮，它显示“地址：null”

我在Eclipse Mars 1中使用JAVA。

定义输入标记的id，因为您使用的是

document.getElementById（）

，并且找不到id，因此每次都返回null。

如果没有地址输入的id，可以使用

var address = document.getElementsByName("txtAddress")[0];

或将ID添加到address元素

<input type="text" id="txtAddress" value="${reqObj.address}" />

jsp中不存在

id

属性

<input type="text" name="txtAddress" value="${reqObj.address}" />

您可以检查

长度

，而不是

null

和

“

不仅使用

id

还可以使用

类、名称、标记来获取

document.getElementById（“xyz”）

document.getElementsByTagName（“p”）

document.getElementsByClassName（“abc”）

document.getElementsByName（“xyz”）


更新：主要是缺少获取该元素的值。获取值，然后检查
address.value.trim（）.length
您可以改用html5验证。这是同样的JFIDLE


您被指定为“txtAddress”作为名称，但不是id。请尝试通过如下方式创建元素id来访问该元素
<input type="text" id="txtAddress" name="txtAddress" value="${reqObj.address}" />

var address = document.TestForm1.txtAddress;

这里的地址仍然是一个对象。检查任何输入类型的验证时，请指定object.value，而不是直接检查object。例如：
var address = document.TestForm1.txtAddress.value;

您正在尝试按id获取值，但您尚未在输入标记的任何位置定义id不是对您进行否决的标记，但我猜是因为您应该解释问题，而不仅仅是提供更正；）更好：）您可以将代码放在其中（在本例中只是一个带有ID的输入示例），但只有代码没有帮助。（我给了你一个+1来帮助你，我怀疑另一个会再次通过以删除他的否决票）我可以添加与名称相同的id属性吗？比如“是完全正确的…”
不工作我的地址字段文本框为空，当我单击提交按钮Alert=“Address:[object HTMLInputElement]”并调用loginServlet。var address=document.getElementById（“txtAddress”）；警报（“地址：”+地址）；如果（address.trim（）.length==0）{alert（“Enter address”）；return false；}上一个问题已经解决，但我有一个下拉列表，我想验证它，我还想验证它，我该如何执行此操作选择IDP 1 IDP 2函数validateForm（）{var IDP=document.getElementById（“ddlIdp”）；如果（IDP.value.trim（）.length==0）{alert（“选择IDP”)；return false；}}}如果问题解决了，您可以接受答案。。对于另一个问题，解决方案是var element=document.getElementById（“elementId”）；var value=element.options[element.selectedIndex].value；var text=element.options[element.selectedIndex].text所以值将被选择，而文本将是选项的显示文本
<input type="text" id="txtAddress" name="txtAddress" value="${reqObj.address}" />

var address = document.TestForm1.txtAddress;

var address = document.TestForm1.txtAddress.value;