标签内容的jquery选择器

问题描述：

我想为具有特定内容的标签找到一个jquery选择器。标签内容的jquery选择器

因此，与下面的HTML

<label for="foo1">Name</label> 
<input type="text" name="foo1" id="foo1" value="Fadime"/> 

<label for="foo2">SecondName</label> 
<input type="text" name="foo2" id="foo2" value="Alice"/>

我希望能够通过在前述标签的内容访问它来获取内容“Fadime”。我不想使用输入或id的名称，因为它们是自动生成的，并且可能会更改。标签的内容将保持不变。因为我知道第二个名字，我可以使用：

var second_name = $("label:contains('SecondName')").next().val();

但是，我不能让头名与内容：

var name = $("label:contains('Name')").next().val();

因为这将同时匹配标签（因为都包含“名称”）。

有一些平等法或startsWith，所以我可以提前使用

var name = $("label:equals('Name')").next().val();

谢谢！

作品如下预期：https://jsfiddle.net/x8etc6yq/您有什么问题??? –

现在如果你想精确匹配，你需要过滤它：https://jsfiddle.net/x8etc6yq/1/ –

如果你需要一个完全匹配，只需使用'$（this）.text（）。trim（）= =在条件中的“名称”。 –

答

:contains用于元素。不适用于文本。你需要使用一个.filter()：

$(function() { 
 
    $("label").filter(function() { 
 
    return $(this).text().indexOf("SecondName") > -1; 
 
    }).next("input").val("Ha ha ha!"); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<label for="foo1">Name</label> 
 
<input type="text" name="foo1" id="foo1" value="Fadime"/> 
 

 
<label for="foo2">SecondName</label> 
 
<input type="text" name="foo2" id="foo2" value="Alice"/>

获取打印到控制台的第二个名字：

$(function() { 
 
    console.log(
 
    $("label").filter(function() { 
 
     return $(this).text().indexOf("SecondName") > -1; 
 
    }).next("input").val() 
 
); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<label for="foo1">Name</label> 
 
<input type="text" name="foo1" id="foo1" value="Fadime" /> 
 

 
<label for="foo2">SecondName</label> 
 
<input type="text" name="foo2" id="foo2" value="Alice" />

太棒了！这工作完美。过滤器诀窍 –

@SamuelSkånberg如果您需要完全匹配，只需在该条件中使用'$（this）.text（）。trim（）==“Name”'。 –

答

$(function() { 
 
    $("label").filter(function() { 
 
    return $(this).text()=="Name" 
 
    }).next("input").val("Ha ha ha!"); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<label for="foo1">Name</label> 
 
<input type="text" name="foo1" id="foo1" value="Fadime"/> 
 

 
<label for="foo2">SecondName</label> 
 
<input type="text" name="foo2" id="foo2" value="Alice"/>

'第一（）'链接到下一个'（）'是多余的，因为下一个'（）'只返回第一下一个同级 –

这是错误的：https://jsfiddle.net/sg8Lq2Lm/参见[next（）的DOC（HTTPS： //api.jquery.com/next/） –

@ A.Wolff是的，我错了它与第一次（），当我更改$（this）.text（）。indexOf（“Name”）> -1它到$（this）.text（）==“Name” – manu

答

有必要为你使用的文本包含过滤器，因为你可以得到标签对应的文本没有它使用下面的代码。请检查

$(document).ready(function() { 
 
    $('label').click(function() { 
 
    \t $id = $(this).attr('for'); 
 
    console.log($('#'+$id).val()); 
 
    }); 
 
});

标签内容的jquery选择器

相关推荐