Javascript Can';t get.focus()将焦点放在Chrome、Safari和FF中id为的输入上

Javascript Can';t get.focus()将焦点放在Chrome、Safari和FF中id为的输入上,javascript,jquery,forms,focus,Javascript,Jquery,Forms,Focus,在发送到数据库之前,我用代码检查电子邮件的有效性时遇到了问题。我有一个javascript代码,可以通过以下方式检查电子邮件: 查看第一封电子邮件是否为有效的电子邮件地址 查看这两个电子邮件字段是否匹配 以下是表格的相关部分: <form action="URLGOESHERE" method="post" name="someName" onSubmit="return validation();" id="formId"> <section class="sect

在发送到数据库之前,我用代码检查电子邮件的有效性时遇到了问题。我有一个javascript代码,可以通过以下方式检查电子邮件:

  • 查看第一封电子邮件是否为有效的电子邮件地址
  • 查看这两个电子邮件字段是否匹配
  • 以下是表格的相关部分:

    <form action="URLGOESHERE" method="post" name="someName" onSubmit="return validation();" id="formId"> 
        <section class="sectionHeader">
            <h2>Contact Information</h2>
            <span class="important">*Required Fields</span>
        </section>
        <section id="contactInfo">
        <fieldset>
            <legend>Contact Information</legend>
            <div id="contact">
                <div class="inputGroupSameLine">
                     <label for="name" class="left"><span class="important">*</span>First Name:</label>
                     <input type="text" name="firstName" class="imp" size="20" maxlength="25" placeholder="John">
                </div>
                <div class="inputGroupSameLine">
                      <label for="name" class="left"><span class="important">*</span>Last Name:</label>         
                      <input type="text" name="lastName" class="imp" size="20" maxlength="25" placeholder="Smith">
                </div>
                <div class="inputGroupSL">
                    <span class="left"><label for="org">Company/Group Name:</label></span>
                    <input type="text" name="org" size="30" maxlength="50" placeholder="Auburn University">
                </div>
                <div class="inputGroupSameLine">
                    <span class="left"><label for="email"><span class="important">*</span>Email:</label></span>
                    <input name='email' id='email' class="imp" type='text' size='45' maxlength='45' placeholder="youremail@example.com" />
                </div>
                <div class="inputGroupSameLine">
                    <span class="left"><label for="email2"><span class="important">*</span>Re-type Email:</label></span>
                    <input name='email2' id='email2' class="imp" type='text' size='45' maxlength='45' placeholder="youremail@example.com"/>
                </div>
                <div id="phoneGroup">
                    <span class="left"><span class="important">*</span>Phone #:</span>
                    <input name='phone' type='text' class="imp" id="phone" size='12' maxlength='20' placeholder="xxx-xxx-xxxx"  />
                </div>
                <div id="extGroup">
                    <span class="left">Ext:</span>
                    <input name='ext' type='text' id="ext" size='12' maxlength='6' placeholder="xxxx"  />
                </div>
            </div>
        </fieldset>
    </section>
    
    
    联系方式
    *必填字段
    联系方式
    *名字:
    *姓氏:
    公司/集团名称:
    *电邮:
    *重新键入电子邮件:
    *电话:
    提取:
    
    下面是我在Submit上运行的代码:

    var reEMail=/^\w[\w\-\.]+\@\w[\w\-]+(\.[\w\-]+)+$/;
    
    function validation() {
        if (!checkImportant()) {
            alert("Please enter information in all fields marked important.");
            return false;
        }
        if (!checkAttendees())
            return false;
        if (!checkEmail($('#email'),$('#email2')))
            return false;
        return true;
    }
    
    function checkImportant()   {
        important = document.getElementsByClassName('imp');
        for (i=0; i < important.length; i++) {
            if($(important[i]).val() == "") {
                $(important[i]).focus();
                return false;
            }
        }
        return true;
    }
    
    function checkAttendees() {
        total = 0 + Number($('#numAttend').val());
        parts = 0 + Number($('#8').val()) + 0 + Number($('#12').val()) + 0 + Number($('#16').val()) + 0 + Number($('#19').val()) + 0 + Number($('#26').val()) + 0 + Number($('#26').val()) + 0 + Number($('#55').val());
        count = 0;
        if (total != (parts)) {
            alert('Please check to ensure you have entered the correct number of participants.');
            count++;
            if (count%2 == 0) {
                $('#numAttend').focus();
                return false;   
            }
            else {
                $('#8').focus();
                return false;   
            }
        }
        return true;
    }
    
    function checkEmail(email,email2)   {
        if (goodEMail2(email)) {      
            if (email.val() != email2.val()) {
              alert("Please check to make sure your email address is correct in both fields!");
              email2.focus();
              return false;
            } 
            else return true;
        }
        else {
          alert("Please input a valid email address");
          setTimeout(function(){
        $('#email').focus();
        }, 100);
          email.select();
          return false;
        } 
        return false;
    }
    
    function goodEMail2(field) {
       return _checkIt2(reEMail, field);
    }
    
    function _checkIt2(re, field){
      if (!re.test(field.val())) {
          field.select();
          field.focus();
          return false;
      }
      else return true;
    }
    
    var-reEMail=/^\w[\w\-\.]+\@\w[\w\-]+(\.[\w\-]+)+$/;
    函数验证(){
    如果(!checkImportant()){
    警报(“请在所有标记为重要的字段中输入信息”);
    返回false;
    }
    如果(!CheckAttendes())
    返回false;
    如果(!checkEmail($('email'),$('email2'))
    返回false;
    返回true;
    }
    函数checkImportant(){
    重要=document.getElementsByClassName('imp');
    对于(i=0;i
    正如您在我的checkEmail函数的主if-else语句中所看到的,我必须使用setTimeout来延迟对email字段的关注。如果我去掉setTimeout,页面将不会关注元素。但是,如果我去掉setTimeout并将指定的元素更改为第二个email字段,它就会工作

    唯一的例外是IE10(我在FF、Chrome、Safari和IE10中的测试)

    我真的不想利用这项工作,我不明白为什么我需要这样做。有人能给我一些想法或答案吗

    谢谢

    编辑:现在似乎无法让我的黑客开始工作。我不知道它以前在做什么。。。因此,现在focus()在该特定元素上根本不起作用。

    更改:

    function checkImportant()   {
        important = document.getElementsByClassName('imp');
        for (i=0; i < important.length; i++) {
            if($(important[i]).val() == "") {
                $(important[i]).focus();
                return false;
            }
        }
        return true;
    }
    
    函数检查重要(){
    重要=document.getElementsByClassName('imp');
    对于(i=0;i
    致:

    函数检查重要(){
    重要=document.getElementsByClassName('imp');
    对于(i=0;i

    在Chrome上为我工作过

    谢谢你的帮助-但这不是我遇到的问题-这是我似乎无法关注的电子邮件。“你没有权限访问此服务器上的/adventure/schedule.php。”抱歉,忘记更改权限了。现在该走了是的。。。将email留空,它会弹出一个窗口,然后关注email字段。这将触发checkImportant功能。如果用*填充所有字段,然后在两封电子邮件中都添加垃圾文本,则会发出警报,但不会聚焦。
    function checkImportant()   {
        important = document.getElementsByClassName('imp');
        for (i=0; i < important.length; i++) {
            if(important[i].value == "") { // drop the jQuery reference, not needed
                important[i].focus();      // drop the jQuery reference, not needed
                return false;
            }
        }
        return true;
    }