1

次の JavaScript ソースがあります。 

var Fname = document.getElementById("FirstName").value;
var Lname = document.getElementById("LastName").value;
var email = document.getElementById("Email").value;
var password = document.getElementById("Pass").value;
var reapeat = document.getElementById("Repeat").value;
var area = document.getElementById("selectArea").value;

各変数が空 ( Fname == "") かどうかを確認する簡単な方法はありますか? はいの場合、どのようにすればよいですか？いいえの場合、それを行う最も簡単な方法は何ですか?

4

4 に答える 4

2

ループでこれを行いたい場合は、配列などのループ可能な構造体にフィールドまたは値が必要です。

var fields = ["FirstName", "LastName", "Email", "Pass", "Repeat", "selectArea"];

for (var i = 0; i < fields.length; i++) {
    if (document.getElementById(fields[i]).value === "") {
        alert("Please fill in all fields.");
        break; // or do whatever you like here.
    }
 }

または、次のように、マークアップで要素に共通のクラスを与えることもできます。

<input class="noblank" ...>

その後：

var fields = document.getElementsByClassName("noblank");
for (var i = 0; i < fields.length; i++) {
    if (fields[i].value === "") {
        alert("Please fill in all fields.");
        break; // or do whatever you like here.
    }
 }

クラスベースのアプローチは、HTML に必須フィールドを追加すると、JS をまったく更新する必要がないため、少し優れています。

于 2013-05-23T13:24:32.780 に答える
0

フォームを検証しようとしているようです。jQuery などのライブラリを使用すると、タスクが簡単になります。

しかし、純粋な JS でそれを行いたい場合は、次のような単純なことを行うことができます。

function formNotEmpty() {
    var i, fields = ['FirstName', 'LastName', ... ];

    for (i = 0; i < fields.length; i += 1) {
        if (fields[i] === '' || fields === null) {
            return false;
        }
    }
    return true;
}

必要に応じて複雑にすることができ、DOM にクエリを実行してフィールドを動的に取得できるため、フィールド配列などを定義する必要はありません。

二重 (==) の代わりに三重の等号演算子 (===) を使用していることに注意してください。ここでその理由 (およびその他のヒント) を読んでください http://www.jslint.com/lint.html

于 2013-05-23T13:35:35.223 に答える