Question

我有以下代码，需要获取一个警报，指定哪些字段为空或为空，并为每个空字段或空字段返回警报。我是JavaScript的新手，并且在这方面苦苦挣扎。谁能给我一些建议呢？

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE></TITLE>

<SCRIPT LANGUAGE="JavaScript">
<!--
    function checkForm(form){
        var len = form.length;

        //create for loop
        for (var i=0; i<len; i++){
            if (form.elements[i].type=="text" || form.elements[i].type==null){
                if (form.fax number.value=="" || form.fax number.type==null){
                    alert("Please fill out the fax number field");
                }
            }
        }
    }

    function emailTest(emailText){
        var email = emailText.value;
        var emailPattern = /^.+@.+\..{2,}$/;
        if (!(emailPattern.test(email))) {
            alert("Please enter a valid email address.");
            document.myForm[1].focus();
        }
    }
// -->
</SCRIPT>

</HEAD>

<BODY>
<H3>Assignment 2 Form</H3>
<HR>

<FORM NAME="myForm" METHOD="post"
ACTION="mailto:joeschmoe@blahblah.ca">
    Name:<BR>
    <INPUT TYPE="text" size="30" NAME="name"><br>
    Email address:<BR>
    <INPUT TYPE="text" size="30" NAME="email address" onBlur="emailTest(this);"><br>
    Phone number:<BR>
    <INPUT TYPE="text" size="30" NAME="phone number"><br>
    Fax number:<BR>
    <INPUT TYPE="text" size="30" NAME="fax number"><p>
    <INPUT TYPE="submit" VALUE="Submit Data" onClick="return checkForm(this.form);">
    <INPUT TYPE="reset" VALUE="Reset Form">
</FORM>

</BODY>
</HTML>

Answer 1

好的...哇。我花了太多时间在这上面。您的表单应如下所示：

<FORM NAME="myForm" id="myForm">
<label for="name">Name:</label><br />
    <INPUT TYPE="text" size="30" NAME="name" /><br />
<label for="email_address">Email address:</label><BR />
    <INPUT TYPE="text" size="30" NAME="email_address" /><br />
<label for="phone_number">Phone number:</label><BR /> 
    <INPUT TYPE="text" size="30" NAME="phone_number" /><br />
<label for="fax_number">Fax number:</label><BR />
    <INPUT TYPE="text" size="30" NAME="fax_number" /><br />
    <INPUT TYPE="button" VALUE="Submit Data" onClick="return checkForm()" />
    <INPUT TYPE="reset" VALUE="Reset Form" />
</FORM>

表格摘要：

您应该使用表单元素的标签
永远不要在名称属性或任何标识属性（名称，类，ID）
input应该以{{1}}结尾，任何没有结束标记的广告都应该结束（/>）
我撤出了<br />事件，并将其作为整体验证过程的一部分添加。不需要太复杂了
我使用onBlur输入类型而不是button输入类型。在JavaScript中查看原因

然后是你的JavaScript：

submit

Javascript摘要

在与HTML表单交互的JavaScript中，表单被称为：function checkForm() { var valid = false; //Set a boolean variable that will be changed on each block //of validation if (document.myForm.fax_number.value === "") { alert("Please fill out the fax number field"); } if (document.myForm.email_address.value === "") { alert("Email address is required"); } else { valid = emailTest(document.myForm.email_address.value); } //all other checks within if statements if (valid) { document.myForm.action = "mailto:soandso@so.com"; document.myForm.submit(); } } function emailTest(emailText) { var emailPattern = /^.+@.+\..{2,}$/; var ret = false; if (!(emailPattern.test(emailText))) { alert("Please enter a valid email address."); } else { ret = true; } return ret; }其中document.formName是表单标记的formName属性中的字符串或name=""其中{ {1}}是页面上表单的数字实例，即页面上的第一个表单是document.forms[i]，因此它将被称为i
按i = 0检查每个document.forms[0] input name其中value是document.myForm.(elementName).value elementName中的字符串} attribute。
我使用的是常规<input>，而不是使用name。当在表单中单击“提交数据”按钮时，它会运行submit以确保一切有效
如果一切有效，则会使用button为表单分配操作，然后通过JavaScript checkForm()

注释

不要使用W3Schools来了解任何事情。
详细了解表格here

形成多个输入的警报

1 个答案:

表格摘要：

Javascript摘要

注释