15

我正在使用 Jquery 进行验证，并且需要从每个具有自己标签的元素中获取 $label。现在 alert() 给出了 med [object object]。对我来说最好的事情是得到一个 alert() ，其中所有未填写的字段都排成一行。而不是每个的 alert() 。

这是一个小提琴：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>

查询：

 $('input').each(function(){
 if ($(this).val() == '') {

 $element = $(this)

 var $label = $("label[for='"+$element.attr('id')+"']")

 alert($label)    

 }

 });

在 alert() 我希望这样“您需要填写：姓名，电子邮件”

4

10 回答 10

29

尝试提醒 的内容$label，您可以为此使用.text()

$('input').each(function(){
    var $element = $(this)

    if ($element.val() == '') {
        var $label = $("label[for='"+this.id+"']")
        alert($label.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)

演示：小提琴

于 2013-08-22T08:42:26.087 回答
3

尝试

$('input').each(function(){
 if ($(this).val() == '') {

 $element = $(this)

 var $label = $("label[for='"+$element.attr('id')+"']")

 alert("You need to fill :" + $label.text())    

 }

 });

演示

更新 ：

是否可以将所有 $label 安排在一个 alert() 而不是一个 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);
 }

演示

于 2013-08-22T08:44:59.783 回答
2

改进答案，您可以将其包装在一个函数中：

function getLabel(name) {
    var $label = $("label[for='" + name + "']")
    return ($label.text());
}

var label = getLabel(this.id);
console.log(label);

这使得重用代码变得更加容易。

于 2020-05-28T18:04:36.590 回答
1

尝试提醒

alert($label.text())
于 2013-08-22T08:41:55.660 回答
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)    

 }

 });
于 2013-08-22T08:42:09.447 回答
1

而不是下面的行：

var $label = $("label[for='"+$element.attr('id')+"']"

使用以下代码：

var $label = $("label[for='"+$element.attr('id')+"']").text();

你只得到你需要使用的对象.html()或.text()获取标签标签内的文本。

于 2013-08-22T08:42:30.840 回答
1

检查此演示

$('input').each(function () {
    if ($(this).val() == '') {

        $element = $(this);

        var label = $element.closest("div").find("label").text();

        alert(label)

    }

});
于 2013-08-22T08:43:54.777 回答
0

这不是一个很好的示例，但您可以使用prevjQuery 中的函数，该函数将在您选择的组件之前找到上一个标签。

$(document).ready( function() {

   $('input').each(function(){
       alert($(this).prev("label").html())
   });

});

JSFiddle：http: //jsfiddle.net/gQnaM/

于 2013-08-22T08:47:42.627 回答
0 
 var response = ""; 
 $('input').each(function(){
     if ($(this).val() == '') {

     response += ", " + $('label[for="' + this.id + '"]').html();
     }
 }); 

alert(response.replace(", ", "You need to fill out: "));
于 2013-08-22T08:58:48.347 回答
0

使用 JQuery，您可以使用 $(input).labels(); 找到链接到输入的所有标签；

$('input').each( function() {
    var $labels = $(this).labels();
    $labels.each(function(index, element){
        alert($(element));
    });
});
于 2018-09-21T13:11:52.753 回答