我的问题是我无法通过验证来验证textarea id = Comment。 any1知道我应该做些什么来使它工作吗?
已经在stackoverflow,w3c和google上看了很多,但我还没有找到解决这个问题的方法:(
HTML:
<form method="POST" id="userform" class="col-xs-12" action="landingpage.html">
<form method="POST" id="userform" class="col-xs-12" action="landingpage.html">
<fieldset>
<legend>Udfyld formularen</legend>
<div class="form-group">
<label class="col-xs-4 control-label " for="fullName">Navn</label>
<div class="col-xs-8">
<input type="text" name="fullname" id="fullname" value="" data-field="required" class="form-control" placeholder="Indtast fulde navn">
</div>
</div>
<div class="form-group">
<label class="col-xs-4 control-label " for="email">Email</label>
<div class="col-sm-8">
<input type="email" name="email" id="email" value="" data-field="required" class="form-control" placeholder="Indtast email">
</div>
</div>
<div class="form-group">
<label class="col-xs-4 control-label" for="Comment">Kommentar</label>
<div class="col-sm-8">
<textarea name="Comment" id="Comment" class="form-control" required ></textarea>
</div>
</div>
<div class="col-xs-12">
<div class="col-xs-4"></div>
<button type="button" class="col-xs-4 btn btn-success" id="sendform">Send</button>
<button type="reset" class="col-xs-4 btn btn-warning" >Nulstil felter</button>
</div>
</fieldset>
JavaScript的:
$(function() {
var result = 1;
var strResult = "";
$("#sendform").click(function() {
$.each($("input"), function(index, value) {
console.log($(this));
if ($(this).data('field') === "required") {
if (!$(this).val()) {
showError($(this), "Du skal udfylde feltet!");
result = 0;
$(this).bind("keypress", function() {
hideError($(this));
result = 1;
});
return false;
} else {
if ($(this).attr("type") === "email") {
if (!isValidEmail($(this).val())) {
showError($(this), "Du skal indtaste en korrekt email!");
result = 0;
$(this).bind("keydown", function() {
hideError($(this));
result = 1;
});
return false;
}
}
}
}
});
if (result > 0) {
strResult = "Navn: " + $("#fullname").val() + "\n";
strResult += "Email: " + $("#email").val() + "\n";
strResult += "kommentar: " + $("#Comment").val(); + "\n";
alert(strResult);
//$("#userform").submit(); alert(field1+'&'+field2);
}
});
});
// show error msg
function showError(inputfield, strMsg) {
if (!$(inputfield).next().hasClass("text-danger")) {
$(inputfield).after("<span class=\"text-danger\">" + strMsg + "</span>");
}
}
// hide error msg
function hideError(inputfield) {
if ($(inputfield).next().hasClass("text-danger")) {
$(inputfield).next().remove();
}
}
// is value a number
function isValidNumber(value) {
var pattern = /^[0-9]+$/;
return pattern.test(value);
}
// is value containing letters
function isValidAlpha(value) {
var pattern = /^[A-ZÆØÅa-zæøå ]+$/;
return pattern.test(value);
}
// does email have a valid syntax
function isValidEmail(value) {
var pattern = /^([\w-]+(?:\.[\w-]+)*)@((?:[\w-]+\.)*\w[\w-]{0,66})\.([a-z]{2,6}(?:\.[a-z]{2})?)$/i;
return pattern.test(value);
}
// does value have a valid length
function isValidLength(value, min, max) {
var pattern = RegExp('^[0-9A-Za-z@#$%]{' + min + ',' + max + '}$');
return pattern.test(value);
}
答案 0 :(得分:0)
首先,通过&#34; textarea&#34;作为每个()API的选择器。
$.each($("input, textarea"), function(index, value) {
其次,使用data-field =&#34; required&#34;对于textarea节点。
<textarea name="Comment" id="Comment" class="form-control" data-field="required"></textarea>