JQuery无法获取元素父级

时间:2015-06-23 18:15:57

标签: javascript jquery html

我在使用JQuery获取父元素时遇到问题。

HTML

<div class="panel-body">
<!--this is the parent element I want to achieve --> 
<div class="form-group" data-required="true">
<label for="emYwndazrRuAeKpZf" class="control-label">Model:</label>
<select class="auto-select form-control" name="items.0.model" id="emYwndazrRuAeKpZf" required="" data-schema-key="items.0.model" autocomplete="off">
<!--this is the child I am trying to get parent -->
<option value="">(Select One)</option>
<option value="AM3" data-description="iHealth Wireless Activity and Sleep Tracker" data-singleprice="20">AM3</option>
<option value="BP5" data-description="bp5" data-singleprice="15">BP5</option> 
<option value="BP3" data-description="BP3" data-singleprice="21">BP3</option>
</select>    
<span class="help-block"></span>
</div>

JS

var $sel = $('.auto-select');
var data = $sel.find(':selected').data();
var $parent = $sel.parent('.panel-body');
console.log($parent.html());
console.log($sel.parent(".panel-body").html())
_.each( data, function(val,key){
    console.log("input[name$='"+key+"']"); 
    $parent.find("input[name$='"+key+"']").val(val)

对于两个console.log我得到了未定义的错误。 我不确定我在哪里做错了,有人可以帮我这些吗? 非常感谢

1 个答案:

答案 0 :(得分:1)

来自jquery.parents() .parent仅遍历一个dom级别,而.parents遍历多个,此处您必须使用.parents,因为select不是.panel-body的直接子级,层次结构是.panel-body .form-group select

创建了jsfiddle

代码在这里:

var $sel = $('.auto-select');
var data = $sel.find(':selected').data();
var $parent = $sel.parents('.panel-body');
console.log($parent.html());
console.log($sel.parent(".panel-body").html())

此外,div.panel-body并未包含</div>,我不知道你至少在<script>中提供了js代码,最好不要在提问时写错字。