我正在使用Jquery进行验证,并且需要使用自己的标签从每个元素获取$ label。现在alert()给出了med [object object]。对我来说最好的事情就是获得一个警告(),其中所有字段都排成一行,没有填写。而不是每个人的警报()。
这是一个小提琴:http://jsfiddle.net/s7pYX/
这是如何完成的?
HTML:
<div>
<label for="txtName">Name</label>
<input type="text" id="txtName" class="form-control" name="txtName">
</div>
<div>
<label for="txtEmail">E-mail</label>
<input type="text" id="txtEmail" class="form-control" name="txtEmail">
</div>
Jquery的:
$('input').each(function(){
if ($(this).val() == '') {
$element = $(this)
var $label = $("label[for='"+$element.attr('id')+"']")
alert($label)
}
});
在警报()中我希望这样“你需要填写:姓名,电子邮件”
答案 0 :(得分:26)
尝试提醒$label
的内容,您可以{/ 3}}使用此
$('input').each(function(){
var $element = $(this)
if ($element.val() == '') {
var $label = $("label[for='"+this.id+"']")
alert($label.text())
}
});
演示:.text()
更新
var $labels = $("label[for]");
var empties = $('input').filter(function(){
return $.trim($(this).val()) == ''
}).map(function(){
return $labels.filter('[for="'+this.id+'"]').text()
}).get().join(', ')
alert(empties)
演示:Fiddle
答案 1 :(得分:3)
尝试
$('input').each(function(){
if ($(this).val() == '') {
$element = $(this)
var $label = $("label[for='"+$element.attr('id')+"']")
alert("You need to fill :" + $label.text())
}
});
更新:
是否可以在一个alert()中安排所有$ label而不是每个一个alert()?
是
var errorString ="";
var isNeedToFill=false;
$('input').each(function(){
if ($(this).val() == '') {
isNeedToFill =true;
$element = $(this)
var $label = $("label[for='"+$element.attr('id')+"']");
errorString += $label.text()+" ";
}
});
if(isNeedToFill){
alert("You need to fill :" +errorString);
}
答案 2 :(得分:1)
尝试提醒
alert($label.text())
答案 3 :(得分:1)
因为您要向警报功能发送object
,如果您想获取所选标签的内容,您必须获取它的html
http://jsfiddle.net/s7pYX/2/
$('input').each(function(){
if ($(this).val() == '') {
$element = $(this)
var $label = $("label[for='"+$element.attr('id')+"']").html();
alert($label)
}
});
答案 4 :(得分:1)
而不是下线:
var $label = $("label[for='"+$element.attr('id')+"']"
使用以下代码:
var $label = $("label[for='"+$element.attr('id')+"']").text();
您只获得了使用.html()
或.text()
获取标签内的文字所需的对象。
答案 5 :(得分:1)
选中此DEMO
$('input').each(function () {
if ($(this).val() == '') {
$element = $(this);
var label = $element.closest("div").find("label").text();
alert(label)
}
});
答案 6 :(得分:0)
这不是一个很好的例子,但您可以使用jQuery中的prev
函数,该函数将在您选择的组件之前找到上一个标签。
$(document).ready( function() {
$('input').each(function(){
alert($(this).prev("label").html())
});
});
JSFiddle:http://jsfiddle.net/gQnaM/
答案 7 :(得分:0)
var response = "";
$('input').each(function(){
if ($(this).val() == '') {
response += ", " + $('label[for="' + this.id + '"]').html();
}
});
alert(response.replace(", ", "You need to fill out: "));
答案 8 :(得分:0)
使用JQuery,您可以使用$(input).labels();找到链接到输入的所有标签。
$('input').each( function() {
var $labels = $(this).labels();
$labels.each(function(index, element){
alert($(element));
});
});
答案 9 :(得分:0)
根据答案的改进,可以将其包装在函数中:
function getLabel(name) {
var $label = $("label[for='" + name + "']")
return ($label.text());
}
var label = getLabel(this.id);
console.log(label);
这使得重用代码更加容易。