Question

如果我有以下代码

    $('.ale').click(function(){
      var val = $('.val').val();
      alert(val);
    })

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

    <label class='ale' for='hello'>
    <input class='val' type='text' id='hello' value='Hello'>
    
    <label class='ale' for='world'>
    <input class='val' type='text' id='world' value='World'>

在此代码中，我正在尝试制作一个脚本，通过点击value

来提醒input label

但这不起作用，因为它总是得到第一个value = 'Hello'

如何定义onclick以获取其id attr = for attr的输入值？

Answer 1

只需获取标签for属性的值，然后使用它查找具有相同id值的输入。

＆＃13;

    $('.ale').click(function(){
      var val = $(this).attr('for');
      alert($('#'+val).val());
    })

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

    <label class='ale' for='hello'>Label 1</label>
    <input class='val' type='text' id='hello' value='Hello'>
    
    <label class='ale' for='world'>Label 2</label>
    <input class='val' type='text' id='world' value='World'>

＆＃13;

Answer 2

试试这个：

$('.ale').click(function () {
  var val = $(this).next('.val').val()
  alert(val)
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<label class='ale' for='hello'>Label 1</label>
<input class='val' type='text' id='hello' value='Hello'>
    
<label class='ale' for='world'>Label 2</label>
<input class='val' type='text' id='world' value='World'>

Answer 3

使用$('.val')时，您将获得代码的类val的所有实例。

使用$(this).next('input').val();

在点击带有for =''属性的标签时提醒输入值

3 个答案: