什么是英国电话号码验证表达式和语法？

Posted 2023-05-09

【中文标题】什么是英国电话号码验证表达式和语法？

【英文标题】：what is the UK Phone number validation expression and syntax?

【发布时间】：2012-08-17 08:39:42

【问题描述】：

function validateForm()

    var x=document.forms["pageFeedbackSurvey"]["emailAddr"].value;
    var atpos=x.indexOf("@");
    var dotpos=x.lastIndexOf(".");
        if (atpos<1 || dotpos<atpos+2 || dotpos+2>=x.length)
            
            alert("Please enter a valid e-mail address");
            return false;
            

    var x=document.forms["pageFeedbackSurvey"]["comments"].value;
        if (x==null || x=="")
            
            alert("Please enter your feedback into the textbox before pressing 'Submit'");
            return false;
            

    var phone = document.getElementById("phone").value;
    var pattern = /^([0-9])7,15$/;
        if (pattern.test(phone)) 
        
        alert("Your phone number : "+phone);
        return true;
         
        alert("It is not valid phone number!");
        return false;
        

然后是html

<form action="demo_form.asp" onsubmit="return validateForm()" method="post" name="pageFeedbackSurvey" id="pageFeedbackSurvey">
                            <div class="pod pageFeedback">
                                <h2>Feedback</h2>
                                <div class="body">                                  
                                    <fieldset>
                                        <div class="surveyrow">
                                            <p id="q1Wording">Did you find the information you were looking for on this page?</p>
                                            <ul>
                                                <li> <!-- input uses class, name and value for jquery -->
                                                    <input name="showdiv2" id="survey1_1" value="Yes" type="radio" class="showsubmit"/><label for="survey1_1">Yes</label>         
                                                </li>
                                                <li>
                                                    <input name="showdiv" id="survey1_2" value="No" type="radio" class="showform"/><label for="survey1_2">Partially</label>
                                                </li>
                                                <li>
                                                    <input name="showdiv" id="survey1_3" value="No" type="radio" class="showform"/><label for="survey1_3">No</label>
                                                </li>
                                            </ul>
                                        </div>

                                        <div id="extraFields">
                                            <div class="commentRow">
                                            <div id="hiddentextarea"> <!-- hidden div -->
                                                <label for="comments">How can we improve this page?</label>
                                                <textarea name="limitedtextarea" onKeyDown="limitText(this.form.limitedtextarea,this.form.countdown,300);" 
                                                onKeyUp="limitText(this.form.limitedtextarea,this.form.countdown,300);" id="comments" rows="8" cols="19"></textarea>
                                                <p>Character limit: <input readonly="readonly" type="text" name="countdown" id="countdown" size="3" value="300"></input></p>
                                            </div>
                                            </div> <!-- end hidden div -->
                                            <div id="hiddenfields"> <!-- hidden div -->
                                            <div class="emailContainer">
                                                <div class="email" id="email">
                                                    <input type="text" name="emailAddr" id="emailAddr" size="22" value="Enter email address"/>
                                                </div>                                                  
                                            </div>
                                            <div class="phoneContainer">
                                                <div class="phone" id="phone">
                                                    <input type="text" name="phone" id="phone" type="phone" size="22" value="" />
                                                </div>                                                  
                                            </div>


                                            <div id="pageFeedbackSubmit" class="button primary right">
                                                <input class="arrow" onclick="validate();" value="Submit" type="submit" id="surveySubmit"/>
                                            </div><!-- button -->
                                            </div> <!-- end hidden div -->
                                            <div class="clearBoth"></div>
                                        </div>

                                    </fieldset>
                                    <div id="errormsg" class="errorMessage" style="display: none"></div>
                                    <div id="thankYou" style="display:none">                                        
                                        <h3>Thank you</h3>                                      
                                        <p>We appreciate you taking the time to help us.</p>                                                                    
                                    </div>

我一直在努力寻找在类型或提交时验证电话输入的解决方案。在选择单选按钮之前，我一直隐藏表单，按下单选按钮后会显示电子邮件和电话以及文本区域，然后我让它验证文本区域的输入和电子邮件的语法，现在我需要验证电话为一个英国号码，我设法让电话字段至少显示一个不正确的弹出警报，但我无法让它接受当前设置中的任何号码。

有人可以告诉我在提交时执行 validateForm 功能的同时验证手机以及电子邮件和文本区域的正确方法吗？

---

以下所有内容均于 2012 年 8 月 23 日添加/编辑

大家好，感谢所有回复，但我仍然无法正常工作，我已更改 ID，因此不再有 2 个 phone id，我将 showdiv2 更改为 showdiv，并且在插入之前将输入类型更改为 tel javascript 电话号码检查

我将 braemoor.co.uk/software/telnumbers.shtml 中的脚本添加到标题中的 javascript 文件中，然后尝试将该 javascript 绑定到 html，该示例中没有 html，所以我一直在猜测...

电子邮件和文本区域的验证功能已经到位

<form action="demo_form.asp" onsubmit="return validateForm()"

这很好用，我想要的是电话功能也可以在提交时或之前运行？我尝试将其添加到提交按钮作为

<input class="arrow" onclick="checkUKTelephone();" value="Submit" type="submit" id="surveySubmit"/>

但它不会验证电话，它只是在验证电子邮件和文本区域后忽略电话号码，然后转发到演示页面，显然我没有做正确的事情，我没有大量的 JavaScript 经验，正如您可能已经注意到的那样:)

谁能告诉我我哪里出错了？

【问题讨论】：

为什么需要验证电话号码？验证它的唯一真实方法是调用它并查看谁接听。电话号码不像大多数银行帐号那样具有同等性，几乎所有事情都会发生。

首先您的 html 代码有误：name="showdiv" instade of name="showdiv2" 对于英国的电话号码验证，有许多高级验证器可用在线示例 braemoor.co.uk/software/telnumbers.shtml 并且代码可用在页面底部

@jidma 哦，是的 jidma 我忘了我之前有一个不同的设置，需要 2 组隐藏的 div，这意味着选择需要 2 个名称......我会改变它

@frits van campen 嗨，谢谢您的回复，我需要验证它，因为公司要求我确保只有英国号码输入表格 - 只需按照订单 :) -

@WebDevMaster 我发给你的链接怎么样，似乎包含英国的高级验证器。

【参考方案1】：

你的 HTML 有问题：

<div class="phoneContainer">
    <div class="phone" id="phone">
       <input type="text" name="phone" id="phone" type="phone" size="22" value="" />
    </div>                                                  
</div>

如您所见，ID“phone”在 DIV 和 INPUT 中出现了两次。

因此，当您尝试获取要验证的电话号码时，它会返回“未定义”，这就是您验证实际电话号码的内容。

<div class="phoneContainer">
    <div class="phone" id="phoneDiv"> <!-- change the name here -->
       <input type="text" name="phone" id="phone" type="phone" size="22" value="" />
    </div>                                                  
</div>

在 HTML 文档中，两个元素可以有相同的名称，但 id 应该是 uniq。

有关基于您的代码的完整示例，请查看：https://docs.google.com/open?id=0B31oh4Omo6z0YjFmNHc2bjJCMk0