使用$(this)作用域查找父级前一个元素

时间:2018-01-27 05:45:28

标签: javascript html

我有一个看起来像这样的HTML: 我试图获得当前父亲最近的对象值。 在这种情况下,我试图获取owner_address,owner_name。

的值
<div class = "form-group row">
  <div class="col-xs-6 form-group">
      <input id="owner_name" type="text></input>
  </div>
  <div class="col-xs-6 form-group">
      <input id="owner_address" type="text></input>
  </div>
</div>
<div class="form-group row">
   <div class="col-xs-6 form-group">
      <input onclick="runFunction($(this))" id="update" type="text></input>
  </div>

</div>

我尝试获取值的JS部分。

<script>
  function runFunction(thisObj){
      var owner_name = thisObj.parent().closest('#owner_name').val()
      #Gives me undefined.
  } 
</script>

我已经尝试过使用ID选择它;它在我的情况下不起作用,因为数据是在模态内呈现的;每个模态都是唯一的。我希望在每个独特的模态中获得特定的所有者名称;这就是为什么我认为使用$(this)会很方便。

3 个答案:

答案 0 :(得分:0)

试试这个

     var owner_name = thisObj.parent().parent().closest('.form-group').find('#owner_name).val()

答案 1 :(得分:0)

试试这个演示:https://jsfiddle.net/xianshenglu/4nt42cso/4/

我更改了js,如果你使用id选择器,则不必使用其他选择器。

function runFunction(thisObj){
  var owner_name = $('#owner_name').val()
  alert(owner_name);
} 

也改变你的html,只需更正语法错误。例如,不应该有这样的代码:&lt; / input&gt; ,,,,

    <div class="form-group row">
    <div class="col-xs-6 form-group">
        <input id="owner_name" type="text" />
    </div>
    <div class=" col-xs-6 form-group ">
        <input id="owner_address " type="text" />
    </div>
</div>
<div class="form-group row">
    <div class="col-xs-6 form-group">
        <input onclick="runFunction($(this))" id="update" type="text" />
    </div>
</div>

答案 2 :(得分:0)

将此功能放入您的功能并检查它是否返回所需的值。

thisObj.parent()。parent()。parent()。find(“#owner_name”)。val();