Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/385.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 验证电子邮件表单在IE中不起作用_Javascript_Jquery_Internet Explorer_Validation_Email - Fatal编程技术网

Javascript 验证电子邮件表单在IE中不起作用

Javascript 验证电子邮件表单在IE中不起作用,javascript,jquery,internet-explorer,validation,email,Javascript,Jquery,Internet Explorer,Validation,Email,我试图构建一个表单,在选中复选框后验证字段。它在除IE之外的所有浏览器中都能正常工作。对在IE中也能正常工作有什么建议吗 <form id="serviceForm" action="MAILTO:myemail@me.com" onSubmit="required(this);" method="POST" enctype="text/plain"> <label for="AgencyRequesting">*Agency Requesting Fac

我试图构建一个表单,在选中复选框后验证字段。它在除IE之外的所有浏览器中都能正常工作。对在IE中也能正常工作有什么建议吗

<form id="serviceForm" action="MAILTO:myemail@me.com" onSubmit="required(this);" method="POST" enctype="text/plain">
        <label for="AgencyRequesting">*Agency Requesting Facility:</label>
        <br />
        <input id="AgencyRequesting" required="required" maxlength="50" name="Agency Requesting Facility" size="50" type="text" />
        <br />
        <br />
        <label for="AgencyContact">*Agency Contact:</label>
        <br />
        <input id="AgencyContact" required="required" maxlength="50" name="Agency Contact" size="50" type="text" />
        <br />
        <br />
        <label for="AgencyPhone">*Contact Phone Number:</label>
        <br />
        <input id="AgencyPhone" required="required" maxlength="14" name="Agency Phone Number" size="14" type="text" />
        <br />
        <br />
        <br />*Area of Facility Requesting: 
        <br /><p style="font-size:.8em;padding:0;">(If interested in reserving the range for your agency, please complete the form below and submit to us.  Once we  receive it, we will email you confirmation and availability.)<br />
            (** Submitting this form does NOT secure your reservation on our facility, it is merely a request.)</p>
        <br />

<!--Gymnasiun checkbox
    *********************************************************************************************************-->  
<input id="gym" name="Gymnasium" type="checkbox" value="Checked" />Gymnasium
    <br />
    <span id="togggym" style="display:none;">
            <span id="togg2" style="display:inline;">
                <lable for="gymStartDate">*Start Date:</lable>
                    <input id="gymStartDate" maxlength="10" name="Start Date" size="10" />
            </span>
            <span id="togg2" style="display:inline;">
                <lable for="gymEndDate">*End Date:</lable>
                    <input id="gymEndDate" maxlength="10" name="End Date" size="10" /><br /><br />
            </span>
            <span id="togg2" style="display:inline;">
                <lable for="gymStartTime">*Start Time:</lable>
                    <input id="gymStartTime" maxlength="7" name="Start Time" size="7" />
            </span>
            <span id="togg2" style="display:inline;">
                <lable for="gymEndTime">*End Time:</lable>
                    <input id="gymEndTime" maxlength="7" name="End Time" size="7" /><br />
            </span>
    </span>
<!--Classroom checkbox
    *********************************************************************************************************-->
<input id="classroom" name="Classroom" type="checkbox" value="Checked" />Classroom
    <br /> 
    <span id="toggclass" style="display:none;">
            <span id="togg2" style="display:inline;">
                <lable for="classStartDate">*Start Date:</lable>
                    <input  id="classStartDate" maxlength="10" name="Start Date" size="10" />
            </span>
            <span id="togg2" style="display:inline;">
                <lable for="classEndDate">*End Date:</lable>
                    <input id="classEndDate" maxlength="10" name="End Date" size="10" /><br /><br />
            </span>
            <span id="togg2" style="display:inline;">
                <lable for="classStartTime">*Start Time:</lable>
                    <input id="classStartTime" maxlength="7" name="Start Time" size="7" />
            </span>
            <span id="togg2" style="display:inline;">
                <lable for="classEndTime">*End Time:</lable>
                    <input id="classEndTime" maxlength="7" name="End Time" size="7" /><br />
            </span>
    </span>
<!--Upper checkbox
    *********************************************************************************************************-->
<input id="upper" name="Upper Track" type="checkbox" value="Checked" />Upper Track
<input id="lower" name="Lower Track" type="checkbox" value="Checked" />Lower Track
<input id="both" name="Both Upper and Lower Track" type="checkbox" value="Checked" />Both
    <br /> 
    <span id="toggupper" style="display:none;">
        <span id="togg2" style="display:inline;">
            <lable for="upperStartDate">*Start Date:</lable>
                <input  id="upperStartDate" maxlength="10" name="Start Date" size="10" />
        </span>
        <span id="togg2" style="display:inline;">
            <lable for="upperEndDate">*End Date:</lable>
                <input id="upperEndDate" maxlength="10" name="End Date" size="10" /><br /><br />
        </span>
        <span id="togg2" style="display:inline;">
            <lable for="upperStartTime">*Start Time:</lable>
                <input id="upperStartTime" maxlength="7" name="Start Time" size="7" />
        </span>
        <span id="togg2" style="display:inline;">
            <lable for="upperEndTime">*End Time:</lable>
                <input id="upperEndTime" maxlength="7" name="End Time" size="7" /><br />
        </span>
    </span>
<!--Lower Checkbox
    *********************************************************************************************************-->
    <span id="togglower" style="display:none;">
        <span id="togg2" style="display:inline;">
            <lable for="lowerStartDate">*Start Date:</lable>
                <input  id="lowerStartDate" maxlength="10" name="Start Date" size="10" />
        </span>
        <span id="togg2" style="display:inline;">
            <lable for="lowerEndDate">*End Date:</lable>
                <input id="lowerEndDate" maxlength="10" name="End Date" size="10" /><br /><br />
        </span>
        <span id="togg2" style="display:inline;">
            <lable for="lowerStartTime">*Start Time:</lable>
                <input id="lowerStartTime" maxlength="7" name="Start Time" size="7" />
        </span>
        <span id="togg2" style="display:inline;">
            <lable for="lowerEndTime">*End Time:</lable>
                <input id="lowerEndTime" maxlength="7" name="End Time" size="7" /><br />
        </span>
    </span>
<!--Both checkbox
    *********************************************************************************************************-->
    <span id="toggboth" style="display:none;">
        <span id="togg2" style="display:inline;">
            <lable for="bothStartDate">*Start Date:</lable>
                <input  id="bothStartDate" maxlength="10" name="Start Date" size="10" />
        </span>
        <span id="togg2" style="display:inline;">
            <lable for="bothEndDate">*End Date:</lable>
                <input id="bothEndDate" maxlength="10" name="End Date" size="10" /><br /><br />
        </span>
        <span id="togg2" style="display:inline;">
            <lable for="bothStartTime">*Start Time:</lable>
                <input id="bothStartTime" maxlength="7" name="Start Time" size="7" />
        </span>
        <span id="togg2" style="display:inline;">
            <lable for="bothEndTime">*End Time:</lable>
                <input id="bothEndTime" maxlength="7" name="End Time" size="7" /><br />
        </span>
    </span>
<!--East Pistol Checkbox
    *********************************************************************************************************-->
<input id="east" name="East Pistol" type="checkbox" value="Checked" />East Pistol
    <br />
    <span id="toggeast" style="display:none;">
        <span id="togg2" style="display:inline;">
            <lable for="eastStartDate">*Start Date:</lable>
                <input  id="eastStartDate" maxlength="10" name="Start Date" size="10" />
        </span>
        <span id="toggeast" style="display:inline;">
            <lable for="eastEndDate">*End Date:</lable>
                <input id="eastEndDate" maxlength="10" name="End Date" size="10" /><br /><br />
        </span>
        <span id="toggeast" style="display:inline;">
            <lable for="eastStartTime">*Start Time:</lable>
                <input id="eastStartTime" maxlength="7" name="Start Time" size="7" />
        </span>
        <span id="toggeast" style="display:inline;"
            <lable for="eastEndTime">*End Time:</lable>
                <input id="eastEndTime" maxlength="7" name="End Time" size="7" /><br />
        </span>
    </span>
<!--West Pistol Checkbox
    *********************************************************************************************************-->
<input id="west" name="West Pistol" type="checkbox" value="Checked" />West Pistol
    <br /> 
    <span id="toggwest" style="display:none">
        <span id="togg2" style="display:inline;">
            <lable for="westStartDate">*Start Date:</lable>
                <input  id="westStartDate" maxlength="10" name="Start Date" size="10" />
        </span>
        <span id="togg2" style="display:inline;">
            <lable for="westEndDate">*End Date:</lable>
                <input id="westEndDate" maxlength="10" name="End Date" size="10" /><br /><br />
        </span>
        <span id="togg2" style="display:inline;">
            <lable for="westStartTime">*Start Time:</lable>
                <input id="westStartTime" maxlength="7" name="Start Time" size="7" />
        </span>
        <span id="togg2" style="display:inline;">
            <lable for="westEndTime">*End Time:</lable>
                <input id="westEndTime" maxlength="7" name="End Time" size="7" /><br />
        </span>
    </span>
<!--Rifle Checkbox
    *********************************************************************************************************-->
<input id="rifle" name="Rifle" type="checkbox" value="Checked" />Rifle
    <br /> 
    <span id="toggrifle" style="display:none">
        <span id="togg2" style="display:inline;">
            <lable for="rifleStartDate">*Start Date:</lable>
                <input  id="rifleStartDate" maxlength="10" name="Start Date" size="10" />
        </span>
        <span id="togg2" style="display:inline;">
            <lable for="rifleEndDate">*End Date:</lable>
                <input id="rifleEndDate" maxlength="10" name="End Date" size="10" /><br /><br />
        </span>
        <span id="togg2" style="display:inline;">
            <lable for="rifleStartTime">*Start Time:</lable>
                <input id="rifleStartTime" maxlength="7" name="Start Time" size="7" />
        </span>
        <span id="togg2" style="display:inline;">
            <lable for="rifleEndTime">*End Time:</lable>
                <input id="rifleEndTime" maxlength="7" name="End Time" size="7" /><br />
        </span>
    </span>
<!--360 Range Checkbox
    *********************************************************************************************************-->
<input id="360" name="360 Range" type="checkbox" value="Checked" />360&#176 Range
    <br /> 
    <span id="togg360" style="display:none">
        <span id="togg2" style="display:inline;">
            <lable for="360StartDate">*Start Date:</lable>
                <input  id="360StartDate" maxlength="10" name="Start Date" size="10" />
        </span>
        <span id="togg2" style="display:inline;">
            <lable for="360EndDate">*End Date:</lable>
                <input id="360EndDate" maxlength="10" name="End Date" size="10" /><br /><br />
        </span>
        <span id="togg2" style="display:inline;">
            <lable for="360StartTime">*Start Time:</lable>
                <input id="360StartTime" maxlength="7" name="Start Time" size="7" />
        </span>
        <span id="togg2" style="display:inline;">
            <lable for="360EndTime">*End Time:</lable>
                <input id="360EndTime" maxlength="7" name="End Time" size="7" /><br />
        </span>
    </span>
<!--Sims Trailers Checkbox
    *********************************************************************************************************-->
<input id="sims" name="Sims Trailers" type="checkbox" value="Checked" />Sims Trailers
    <br /> 
    <span id="toggsims" style="display:none">
        <span id="togg2" style="display:inline;">
            <lable for="simsStartDate">*Start Date:</lable>
                <input  id="simsStartDate" maxlength="10" name="Start Date" size="10" />
        </span>
        <span id="togg2" style="display:inline;">
            <lable for="simsEndDate">*End Date:</lable>
                <input id="simsEndDate" maxlength="10" name="End Date" size="10" /><br /><br />
        </span>
        <span id="togg2" style="display:inline;">
            <lable for="simsStartTime">*Start Time:</lable>
                <input id="simsStartTime" maxlength="7" name="Start Time" size="7" />
        </span>
        <span id="togg2" style="display:inline;">
            <lable for="simsEndTime">*End Time:</lable>
                <input id="simsEndTime" maxlength="7" mane="End Time" size="7" /><br />
        </span>
    </span>

    <br />
    <br />
    <label for="description">Comments:</label>
    <br />
    <textarea name="Comments" cols="40" rows="5"></textarea>
    <br />
    <br />* denotes required fields
    <br />
    <input type="submit" id="submit" value="SUBMIT" />
</form>
JavaScript可能已经失控了,但我对它的编程非常陌生,还有很多东西需要学习。 谢谢你的帮助,如果有更好的方法写这篇文章,我愿意接受每一个建议


**这里是对正在运行的表单的更新

您似乎还不熟悉使用Javascript/jQuery验证表单

我建议使用jQuery插件,如jQuery.validate来验证表单前端。该插件将确保验证工作跨浏览器,包括Internet Explorer

建议的条款:


  • 另外,别忘了前端是验证,这只是战斗的一半,你还需要验证后端!为确保传递到表单数据处理脚本的数据的安全性和有效性。

    请您更具体地说,什么是无效的?在IE中按下提交按钮时,会打开一封没有内容的电子邮件,但在Firefox、Opera和Chrome中按下提交按钮时,电子邮件会填充所有信息字段。
    /*Gym
        ********************************************************************************/
        $(document).ready(function(){
            $("#gym").change(function(){              
                $("#togggym").toggle(this.checked);
                $("#gymStartDate").toggleClass("required");
                $("#gymEndDate").toggleClass("required");
                $("#gymStartTime").toggleClass("required");
                $("#gymEndTime").toggleClass("required");
    
        if(this.checked){
               $("#gymStartDate").attr('required','required');
               $("#gymEndDate").attr('required','required');
               $("#gymStartTime").attr('required','required');
               $("#gymEndTime").attr('required','required');
          }
          else{
               $("#gymStartDate").removeAttr('required')
               $("#gymEndDate").removeAttr('required')
               $("#gymStartTime").removeAttr('required')
               $("#gymEndTime").removeAttr('required')
          }
    
            });
        });
    /*Classroom
        *******************************************************************************/
        $(document).ready(function(){
            $("#classroom").change(function(){              
                $("#toggclass").toggle(this.checked);
                $("#classStartDate").toggleClass("required");
                $("#classEndDate").toggleClass("required");
                $("#classStartTime").toggleClass("required");
                $("#classEndTime").toggleClass("required");
    
        if(this.checked){
               $("#classStartDate").attr('required','required');
               $("#classEndDate").attr('required','required');
               $("#classStartTime").attr('required','required');
               $("#classEndTime").attr('required','required');
          }
          else{
               $("#classStartDate").removeAttr('required')
               $("#classEndDate").removeAttr('required')
               $("#classStartTime").removeAttr('required')
               $("#classEndTime").removeAttr('required')
          }
    
            });
        });
    /*Upper
        *******************************************************************************/
            $(document).ready(function(){
            $("#upper").change(function(){              
                $("#toggupper").toggle(this.checked);
                $("#upperStartDate").toggleClass("required");
                $("#upperEndDate").toggleClass("required");
                $("#upperStartTime").toggleClass("required");
                $("#upperEndTime").toggleClass("required");
    
        if(this.checked){
               $("#upperStartDate").attr('required','required');
               $("#upperEndDate").attr('required','required');
               $("#upperStartTime").attr('required','required');
               $("#upperEndTime").attr('required','required');
          }
          else{
               $("#upperStartDate").removeAttr('required')
               $("#upperEndDate").removeAttr('required')
               $("#upperStartTime").removeAttr('required')
               $("#upperEndTime").removeAttr('required')
          }
    
            });
        });
    /*lower
        *******************************************************************************/
            $(document).ready(function(){
            $("#lower").change(function(){              
                $("#togglower").toggle(this.checked);
                $("#lowerStartDate").toggleClass("required");
                $("#lowerEndDate").toggleClass("required");
                $("#lowerStartTime").toggleClass("required");
                $("#lowerEndTime").toggleClass("required");
    
        if(this.checked){
               $("#lowerStartDate").attr('required','required');
               $("#lowerEndDate").attr('required','required');
               $("#lowerStartTime").attr('required','required');
               $("#lowerEndTime").attr('required','required');
          }
          else{
               $("#lowerStartDate").removeAttr('required')
               $("#lowerEndDate").removeAttr('required')
               $("#lowerStartTime").removeAttr('required')
               $("#lowerEndTime").removeAttr('required')
          }
    
            });
        });
    /*Both
        *******************************************************************************/
            $(document).ready(function(){
            $("#both").change(function(){              
                $("#toggboth").toggle(this.checked);
                $("#bothStartDate").toggleClass("required");
                $("#bothEndDate").toggleClass("required");
                $("#bothStartTime").toggleClass("required");
                $("#bothEndTime").toggleClass("required");
    
        if(this.checked){
               $("#bothStartDate").attr('required','required');
               $("#bothEndDate").attr('required','required');
               $("#bothStartTime").attr('required','required');
               $("#bothEndTime").attr('required','required');
          }
          else{
               $("#bothStartDate").removeAttr('required')
               $("#bothEndDate").removeAttr('required')
               $("#bothStartTime").removeAttr('required')
               $("#bothEndTime").removeAttr('required')
          }
    
            });
        });
    /*East Pistol
        *******************************************************************************/
            $(document).ready(function(){
            $("#east").change(function(){              
                $("#toggeast").toggle(this.checked);
                $("#eastStartDate").toggleClass("required");
                $("#eastEndDate").toggleClass("required");
                $("#eastStartTime").toggleClass("required");
                $("#eastEndTime").toggleClass("required");
    
        if(this.checked){
               $("#eastStartDate").attr('required','required');
               $("#eastEndDate").attr('required','required');
               $("#eastStartTime").attr('required','required');
               $("#eastEndTime").attr('required','required');
          }
          else{
               $("#eastStartDate").removeAttr('required')
               $("#eastEndDate").removeAttr('required')
               $("#eastStartTime").removeAttr('required')
               $("#eastEndTime").removeAttr('required')
          }
    
            });
        });
    /*West Pistol
        *******************************************************************************/
            $(document).ready(function(){
            $("#west").change(function(){              
                $("#toggwest").toggle(this.checked);
                $("#westStartDate").toggleClass("required");
                $("#westEndDate").toggleClass("required");
                $("#westStartTime").toggleClass("required");
                $("#westEndTime").toggleClass("required");
    
        if(this.checked){
               $("#westStartDate").attr('required','required');
               $("#westEndDate").attr('required','required');
               $("#westStartTime").attr('required','required');
               $("#westEndTime").attr('required','required');
          }
          else{
               $("#westStartDate").removeAttr('required')
               $("#westEndDate").removeAttr('required')
               $("#westStartTime").removeAttr('required')
               $("#westEndTime").removeAttr('required')
          }
    
            });
        });
    /*Rifle
        *******************************************************************************/
            $(document).ready(function(){
            $("#rifle").change(function(){              
                $("#toggrifle").toggle(this.checked);
                $("#rifleStartDate").toggleClass("required");
                $("#rifleEndDate").toggleClass("required");
                $("#rifleStartTime").toggleClass("required");
                $("#rifleEndTime").toggleClass("required");
    
        if(this.checked){
               $("#rifleStartDate").attr('required','required');
               $("#rifleEndDate").attr('required','required');
               $("#rifleStartTime").attr('required','required');
               $("#rifleEndTime").attr('required','required');
          }
          else{
               $("#rifleStartDate").removeAttr('required')
               $("#rifleEndDate").removeAttr('required')
               $("#rifleStartTime").removeAttr('required')
               $("#rifleEndTime").removeAttr('required')
          }
    
            });
        });
    /*360 Range
        *******************************************************************************/
            $(document).ready(function(){
            $("#360").change(function(){              
                $("#togg360").toggle(this.checked);
                $("#360StartDate").toggleClass("required");
                $("#360EndDate").toggleClass("required");
                $("#360StartTime").toggleClass("required");
                $("#360EndTime").toggleClass("required");
    
        if(this.checked){
               $("#360StartDate").attr('required','required');
               $("#360EndDate").attr('required','required');
               $("#360StartTime").attr('required','required');
               $("#360EndTime").attr('required','required');
          }
          else{
               $("#360StartDate").removeAttr('required')
               $("#360EndDate").removeAttr('required')
               $("#360StartTime").removeAttr('required')
               $("#360EndTime").removeAttr('required')
          }
    
            });
        });
    /*Sims Trailers
        *******************************************************************************/
            $(document).ready(function(){
            $("#sims").change(function(){              
                $("#toggsims").toggle(this.checked);
                $("#simsStartDate").toggleClass("required");
                $("#simsEndDate").toggleClass("required");
                $("#simsStartTime").toggleClass("required");
                $("#simsEndTime").toggleClass("required");
    
        if(this.checked){
               $("#simsStartDate").attr('required','required');
               $("#simsEndDate").attr('required','required');
               $("#simsStartTime").attr('required','required');
               $("#simsEndTime").attr('required','required');
          }
          else{
               $("#simsStartDate").removeAttr('required')
               $("#simsEndDate").removeAttr('required')
               $("#simsStartTime").removeAttr('required')
               $("#simsEndTime").removeAttr('required')
          }
    
            });
        });