私はオンラインでのコード化テストを行ったので、フォーム入力用のデータ検証をしなければなりませんでした(問題の説明は下記を参照)。問題の説明に基づいて、誰かが私のアプローチに間違っているかもしれないことを教えてください。HTML文書フォームの検証ユーザー入力JavaScript
フォームでHTMLドキュメントを与えられ、あなたのタスクは、JavaScriptでそれを検証することです
この私のコード
function solution() {
try {
var person =$("#type_person").is(":checked");
var company =$("#type_company").is(":checked");
var fName =$("#first_name").val();
var lName =$("#last_name").val();
var email =$("#email").val();
var companyName =$("#company_name").val();
var phone =$("#phone").val();
var result = true;
if (person) {
result = result && fName.match("[a-zA-Z ]+");
result = result && lName.match("[a-zA-Z ]+");
result = result && email.match("^[a-zAZ.]{1,64}@[a-zA-Z.]{1,64}$");
} else if (company) {
result = result && companyName.match("(.)+");
result = result && phone.match("^[\d]{3}-[\d]{3}-[\d]{4}$");
} else {
result = false;
}
} catch (ex) {
// Possible when a DOM Element isn't found
return false;
}
return result;
}
input {
float: left;
}
input[type=text],
input[type=button] {
clear: left;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="radio" id="type_person" name="type" value="person" />
<input type="radio" id="type_company" name="type" value="company" checked/>
<input type="text" id="first_name" name="first_name" value="John" />
<input type="text" id="last_name" name="last_name" value="Doe" />
<input type="text" id="email" name="email" value="[email protected]" />
<input type="text" id="company_name" name="company_name" value="ACME" />
<input type="text" id="phone" name="phone" value="12-3" />
<input type="button" value="Validate" />
問題の説明。このフォームは、個人または会社の連絡先データを入力するために使用されます。 "type"というラジオボタンは、この選択を制御します。そのようなボタン(値 "person"または "company")の1つだけがチェックされます。
「人」オプションがチェックされている場合は、次のフィールド(およびこれらのみ)を検証する必要があります:
FIRST_NAMEとLAST_NAMEが空でなければなりません。たとえば、 "John"と ""(スペース)は有効ですが、 ""は有効ではありません。
電子メールの検証は、単純なスキームに従って行う必要があります。さらに、両方の部分(@の前後)は、文字、数字および/またはドット(a-z、A-Z、0-9 ,.)のみからなる少なくとも1文字から最大64文字で構成する必要があります。たとえば、 "[email protected]"と "。@。"有効ですが、 "@ example.com"は有効ではありません。
「会社」オプションがチェックされている場合は、次のフィールド(およびこれらのみ)を検証する必要があります:
COMPANY_NAMEが空である必要があります。
電話機は、数字、ダッシュ( - )、スペースのみで構成する必要があります。少なくとも6桁の数字が必要です。たとえば、 "234-567-890"は有効ですが、 "12-3"は有効ではありません。
関数を作成します。関数の解();
HTMLドキュメントを表すDOMツリーがある場合、このドキュメントのフォームが有効かどうかを示すブール値を返します。例えば
、
タグ内に次の内容のHTMLドキュメントを与えられた:
<form>
<input type="radio" id="type_person" name="type" value="person"/>
<input type="radio" id="type_company" name="type" value="company" checked/>
<input type="text" id="first_name" name="first_name" value="John"/>
<input type="text" id="last_name" name="last_name" value="Doe"/>
<input type="text" id="email" name="email" value="[email protected]"/>
<input type="text" id="company_name" name="company_name" value="ACME"/>
<input type="text" id="phone" name="phone" value="12-3"/>
</form>
:次の内容を与えながら、あなたの関数は、trueを返す必要があります <input type="radio" id="type_person" name="type" value="person" checked/>
<input type="radio" id="type_company" name="type" value="company"/>
<input type="text" id="first_name" name="first_name" value="John"/>
<input type="text" id="last_name" name="last_name" value="Doe"/>
<input type="text" id="email" name="email" value="[email protected]"/>
<input type="text" id="company_name" name="company_name" value=""/>
<input type="text" id="phone" name="phone" value="234-567-890"/>
</form>