面对jQuery中定位Next类的问题

时间:2017-05-02 15:13:47

标签: jquery

您能否请一看这个spinet,让我知道为什么我无法定位.help-block附近存在的第一个input

你可以看到我已经尝试了

$(this).parent().find('help-block').html('Name Field  Can\'t Be Empty!');
$(this).closest('help-block').html('Name Field  Can\'t Be Empty!');
$(this).parent().next('.help-block').html('Name Field  Can\'t Be Empty!');

但仍然无法定位该段落。

function txtInput(elem) {
        var inputData = $.trim(elem.val());
        if (inputData == "") {
          $(this).parent().find('help-block').html('Name Field  Can\'t Be Empty!');
          $(this).closest('help-block').html('Name Field  Can\'t Be Empty!');
          $(this).parent().next('.help-block').html('Name Field  Can\'t Be Empty!');
        }
    }


$(".btn-default").on("click", function(){
    if (txtInput($('#name'))){console.log("It Works");}
    
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="col-md-12">
  <div class="input-group">
    <span class="input-group-addon">Name</span>
    <input class="name" id="name" name="name" class="form-control" placeholder="Your Name" type="text">
  </div>
  <p class="help-block">help</p>
</div>

<button class="btn btn-default">Text</button>

1 个答案:

答案 0 :(得分:1)

将您的功能更改为使用elem而不是:

function txtInput(elem) {
        var inputData = $.trim(elem.val());
        if (inputData == "") {
          $(elem).parent().find('help-block').html('Name Field  Can\'t Be Empty!');
          $(elem).closest('help-block').html('Name Field  Can\'t Be Empty!');
          $(elem).parent().next('.help-block').html('Name Field  Can\'t Be Empty!');
        }
    }

只是通过改变它现在有效。这是fiddle的工作。