[英]To validate and connvert entered phone number in a form
I am working on an HTML form which has 4 fields as below 我正在处理具有以下4个字段的HTML表单
Name
Email
Phone Number
Message
The field for phone number should accept 10 digits. 电话号码字段应接受10位数字。 It change/accept of the format
(xxx) xxx-xxxx
when i click on the Message field. 当我单击“消息”字段时,它更改/接受
(xxx) xxx-xxxx
格式。
I have written the function for javascript to do so but the number is not getting changed when i click on the message field. 我已经为javascript编写了此功能,但是单击消息字段时,该数字未更改。 The code is below
代码如下
It would be a great help if someone could help me out with this. 如果有人可以帮助我,这将是一个很大的帮助。 Thanks in advance!
提前致谢!
function PhoneValidation(phone) {
if (!(this.isNull)) {
var str = this.rawValue;
var regExp = /^\d{10}$/;
if (regExp.test(str)) {
this.rawValue = "(" + str.substr(0, 3) + ") " + str.substr(3, 3) + "-" + str.substr(6, 4);
} else {
regExp = /^[1-9]\d{2}\s\d{3}\s\d{4}$/;
if (regExp.test(str)) {
this.rawValue = "(" + str.substr(0, 3) + ") " + str.substr(4, 3) + "-" + str.substr(8, 4);
} else {
regExp = /^\([1-9]\d{2}\)\s?\d{3}\-\d{4}$/;
if (!(regExp.test(str))) {
xfa.host.messageBox("Please enter the telephone number in the format '(999) 999-9999'.");
this.rawValue = null;
xfa.host.setFocus(this);
}
}
}
}
}
And HTML below: 和下面的HTML:
<form id="contact-form" class="contact-form" method="post" action="">
<div class="result"></div>
<input type="text" name="contact[name]" id="name" placeholder="Name *">
<input type="text" name="contact[email]" id="email" placeholder="E-mail *">
<input type="text" name="phone" id="phone" placeholder="Phone" onChange="PhoneValidation(this)" ;>
<textarea cols="5" rows="5" name="contact[message]" id="message" placeholder="Message *"></textarea>
<input type="submit" class="btn-dark" value="SEND">
</form>
in your validate
function this = window
, or something else so I have no idea what will !this.isNull
actually do. 在您的
validate
函数中, this = window
或其他内容,所以我不知道!this.isNull
实际会做什么。
You may change it to something like 您可以将其更改为
function PhoneValidation(phone) {
if(phone.value) {
// set up the phone.value here
}
}
// bind the change event as you did.
<input type="text" name="phone" id="phone" placeholder="Phone" onChange="PhoneValidation(this)";>
EDIT The code above is just the idea, please note that inside PhoneValidation in your case this = window
. 编辑上面的代码仅是个主意,请注意,在您的情况下,在PhoneValidation中
this = window
。 You have passed phone so try to use it, you can take the demo here http://jsfiddle.net/7qjz2/ . 您已通过电话,请尝试使用它,您可以在http://jsfiddle.net/7qjz2/上进行演示。 As a summary
作为总结
window.PhoneValidation = function(phone)
// cause I don't know where you put this js, so let bind it to window.
Next in side function, rawValue
is undefined so use phone.value
instead If you can't pass the condition, set the html for your message div. 旁函数中,未定义
rawValue
,因此请改用phone.value
如果无法通过条件,请为消息div设置html。 by 通过
document.getElementById("result").innerHTML = "Whatever you want"
That's all. 就这样。 Hope this help!
希望有帮助!
if (!(this.isNull)) {
显然,使其简短而简单,例如:
if (this) {
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.