用于验证元素值和复选框的 Javascript

Question

我想使用js来检查表单，以防我的复选框都没有被选中并且输入字段还没有被填充。在这种情况下，用户应该收到一条消息，告诉他们至少做出一个选择或制定自己的选择。

表单元素...

<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 中解决这个问题。

Answer 1

大小写与 ID 值有关，因此请更改此设置:

document.getElementById("text").value

将此内容与您的 HTML 中的内容相匹配:

document.getElementById("Text").value

一旦我解决了案例问题并输入代码来实际调用checkFormElement()，它似乎在这里工作正常:http://jsfiddle.net/jfriend00/9DHxF/