使用jQuery查找所选控件或文本框的标签

时间:2011-09-17 13:17:49

标签: jquery jquery-selectors

我想要一些jQuery代码,当我点击文本框时,我可以找到控件的标签...所以在我的HTML中我有这个:

<label id="ctl00_WebFormBody_lblProductMarkup"  for="ctl00_WebFormBody_txtPriceAdjustment">This Is My Label Value</label>

<input type="text" style="width:29px;" onclick="alert('label value here');" title="Here is a title" id="ctl00_WebFormBody_txtPriceAdjustment" maxlength="3" name="ctl00$WebFormBody$txtPriceAdjustment">

因此,当我点击我的文本框时,我希望(例如)使用我标签内的文本进行警告...所以在这种情况下它会提醒“这是我的标签值”

希望有道理:)

6 个答案:

答案 0 :(得分:43)

使用属性选择器[],例如[for='+ this.id +'],其中this.id是当前focus ed label <的 ID / p>

$('input').on("focus", function() {
   var labelText = $('label[for='+  this.id  +']').text();
   console.log( labelText );  
});
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<label for="inp">This Is My Label Value</label>
<input  id="inp" type="text" >

答案 1 :(得分:2)

$("#ctl00_WebFormBody_txtPriceAdjustment").bind("click",function(){
    alert($("label [for=" + this.id + "]").html());
});

或可能

alert($(this).closest("label").html());

取决于您的标记,您也可以选择下一个或上一个兄弟姐妹。

答案 2 :(得分:2)

在像这样的HTML代码中:

<label for="input-email">Email</label>
<input type="text" name="input-email" value="" />

您可以找到如下标签内容:

$('label[for="input-email"]').html();

答案 3 :(得分:1)

试试这个:

$('input[type=text]').focus(function(){
     alert($('label[for=' + $(this).attr('id') + ']').html());
});

答案 4 :(得分:0)

$('#ctl00_WebFormBody_txtPriceAdjustment').click(function() {
  alert($('#ctl00_WebFormBody_lblProductMarkup').text());
});

答案 5 :(得分:0)

使用javascript执行此操作

<script type="text/javascript">
function displayMessage()
{
alert(document.getElementById("ctl00_WebFormBody_lblProductMarkup").innerHTML);
}
</script>

<label id="ctl00_WebFormBody_lblProductMarkup"  for="ctl00_WebFormBody_txtPriceAdjustment">This Is My Label Value</label>

<input type="text" style="width:29px;" onclick="displayMessage()" title="Here is a title" id="ctl00_WebFormBody_txtPriceAdjustment" maxlength="3" name="ctl00$WebFormBody$txtPriceAdjustment">