0

如果我的复选框都没有被选中并且输入字段没有被填写，我想使用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 中解决这个问题。

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

您缺少submit将运行的按钮\选项或类似类型checkFormElement()。一旦你包含了调用这个函数的东西，你应该不会遇到任何问题。

于 2012-08-21T20:16:05.630 回答
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 回答