我在使用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我得到了未定义的错误。 我不确定我在哪里做错了,有人可以帮我这些吗? 非常感谢
答案 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代码,最好不要在提问时写错字。