0

チェックボックスがどれもチェックされておらず、入力フィールドが入力されていない場合に、js を使用してフォームをチェックしたいと考えています。この場合、ユーザーは、少なくとも 1 つの選択を行うか、独自に作成するように指示するメッセージを受け取る必要があります。

フォーム要素...

<input type="checkbox" name="checkboxA" id="checkboxA" value="X" />
<input type="checkbox" name="checkboxB" id="checkboxB" value="Y" />
<input type="checkbox" name="checkboxC" id="checkboxC" value="Z" />

<input type="text" id="Text" class="textfield" value="please enter text." maxlength="100" size="40" onblur="if (this.value == '') {this.value = 'please enter text';}"  onfocus="if (this.value == 'please enter text') {this.value = '';}" />

... POST メソッドの実行時に、この js 関数によってチェックされます。

function checkFormElement() {
if ((document.getElementById("text").value == "please enter text.")
    && (document.getElementById("checkboxA").checked == false)
    && (document.getElementById("checkboxB").checked == false)
    && (document.getElementById("checkboxC").checked == false)){
        alert("Please choose out of X Y Z or formulate your own choice .");
        document.getElementById("checkboxA").focus();
    return false;
    }
return true;

}

jQuery を使用する方がはるかに簡単だと思いますが、純粋な js でこれを解決する方法を知りたいと思っています。

4

3 に答える 3

3

ID値では大文字と小文字が区別されるため、次のように変更します。

document.getElementById("text").value

これにあなたがあなたのHTMLに持っているものと一致するために:

document.getElementById("Text").value

ケースの問題を修正し、実際に呼び出すコードを入力するとcheckFormElement()、ここで正常に機能するようです:http: //jsfiddle.net/jfriend00/9DHxF/

于 2012-08-21T20:10:24.753 に答える
0

コードにいくつかのエラーがあります。主にIDの不一致など。

ここでの実例: http://jsfiddle.net/E8SBq/

これはあなたのために働くはずです:

<input type="checkbox" name="checkboxA" id="checkboxA" value="X" />
<input type="checkbox" name="checkboxB" id="checkboxB" value="Y" />
<input type="checkbox" name="checkboxC" id="checkboxC" value="Z" />

<input type="text" id="Text" class="textfield" value="please enter text" maxlength="100" size="40" onblur="if (this.value == '') {this.value = 'please enter text';}"  onfocus="if (this.value == 'please enter text') {this.value = '';}" />
<input type="submit" value="Submit" onClick="checkFormElement()" />

そしてJS関数:

function checkFormElement() {
if (document.getElementById("Text").value != null  
    && document.getElementById("checkboxA").checked == false
    && document.getElementById("checkboxB").checked == false
    && document.getElementById("checkboxC").checked == false) {
        alert("Please choose out of X Y Z or formulate your own choice .");
        document.getElementById("checkboxA").focus();
    return false;
    }
return true;

}
于 2012-08-21T20:18:56.130 に答える
0

submit実行される、または同様のタイプのボタン\オプションがありませんcheckFormElement()。この関数を呼び出すものを含めれば、問題は発生しません。

于 2012-08-21T20:16:05.630 に答える