带有复选框的jQuery表单验证

时间:2012-03-22 11:12:47

标签: jquery forms validation

<form name="author-form" accept-charset="utf-8" method="post">

<input type="checkbox" id="checklist-1" name="checklist[]" value="0"  required /></td>

<label for="checklist-1">The submission has not been previously published, nor is it before another journal for consideration (or an explanation has been provided in Comments to the Editor).</label>

<input type="checkbox" id="checklist-2" name="checklist[]" value="1" required />
<label for="checklist-2">The submission file is in OpenOffice, Microsoft Word, RTF, or WordPerfect document file format.</label>

<input type="checkbox" id="checklist-3" name="checklist[]" value="2" required />
<label for="checklist-3">Where available, URLs for the references have been provided.</label>

<input type="checkbox" id="checklist-4" name="checklist[]" value="3" required />
<label for="checklist-4">The text is single-spaced; uses a 12-point font; employs italics, rather than underlining (except with URL addresses); and all illustrations, figures, and tables are placed within the text at the appropriate points, rather than at the end.</label>

<input type="checkbox" id="checklist-5" name="checklist[]" value="4" required />
<label for="checklist-5">The text adheres to the stylistic and bibliographic requirements outlined in the <a href="http://42.201.215.2/ojs/index.php/JISRComputing/about/submissions#authorGuidelines" target="_new">Author Guidelines</a>, which is found in About the Journal.</label>

<input type="checkbox" id="checklist-6" name="checklist[]" value="5" required />
<label for="checklist-6">If submitting to a peer-reviewed section of the journal, the instructions in <a href="javascript:openHelp('http://42.201.215.2/ojs/index.php/JISRComputing/help/view/editorial/topic/000044')">Ensuring a Blind Review</a> have been followed.</label>


<textarea name="commentsToEditor" id="commentsToEditor" rows="3" cols="40" class="textArea" placeholder="Comments to the Editor" required></textarea>

<input type="submit" name="submit-1" class="btn disabled" value="Continue">

</form>

我想在选中所有复选框并且在文本区域中至少写入一个单词后更改提交的css类。如果所有规则都已满足,那么该类应该是这样的,并且如果不满足一个规则,则应该再次禁用它

<input type="submit" name="submit-1" class="btn success" value="Continue">

如何定义一个jQuery函数,只有在单击复选框并在textarea中输入单词时才能启用提交按钮?

1 个答案:

答案 0 :(得分:2)

最初禁用了提交按钮,然后将更改事件处理程序附加到复选框

$(":checkbox,textarea").change(function(){
 if(($(":checkbox").length== $(":checkbox:checked").length) && $("textarea").val()!=""){
  $(":submit").addClass("success").removeAttr("disabled");

 }
});

DEMO