我想获取父属性,但它 returns 未定义 jquery
I want to fetch the parent attribute but it returns undefined jquery
这是我的代码:
$(document).on('click', '.setting', function(e){
alert($(this).parent().data('fieldtype'));
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="row" id="field">
<div class="col-md-9 col-sm-6 col-xs-6 pad" style="">
<textarea class="form-control field" name="key1" rows="3" data-fieldtype="test" data-group="">demo</textarea>
</div>
<div class="col-md-1 col-sm-2 col-xs-2 pad pointer movefield" data-key="1">
<div><span class="glyphicon glyphicon-arrow-up"></span></div>
</div>
<div class="col-md-1 col-sm-2 col-xs-2 pad pointer setting" data-key="1">
<div><span class="glyphicon glyphicon-cog">click me</span></div>
</div>
<div class="col-md-1 col-sm-2 col-xs-2 pad pointer field-remove" data-key="1">
<div>x</div>
</div>
</div>
现在的问题是没有得到 data-fieldtype
的值,因为这个方法是 returns undefined
。
并且还建议获取 data-group
的值,因为目前这个是空白的
因为 textarea
不是 .setting
的父级。它的父项是 #field
,您应该在其中找到 textarea。
$(this).parent().find('[data-fieldtype]').data('fieldtype')
$(document).on('click', '.setting', function(e){
console.log(
$(this).parent().find('[data-fieldtype]').data('fieldtype')
);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="row" id="field">
<div class="col-md-9 col-sm-6 col-xs-6 pad" style="">
<textarea class="form-control field" name="key1" rows="3" data-fieldtype="test" data-group="">demo</textarea>
</div>
<div class="col-md-1 col-sm-2 col-xs-2 pad pointer movefield" data-key="1">
<div><span class="glyphicon glyphicon-arrow-up"></span></div>
</div>
<div class="col-md-1 col-sm-2 col-xs-2 pad pointer setting" data-key="1">
<div><span class="glyphicon glyphicon-cog">click me</span></div>
</div>
<div class="col-md-1 col-sm-2 col-xs-2 pad pointer field-remove" data-key="1">
<div></div>
</div>
</div>
这是我的代码:
$(document).on('click', '.setting', function(e){
alert($(this).parent().data('fieldtype'));
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="row" id="field">
<div class="col-md-9 col-sm-6 col-xs-6 pad" style="">
<textarea class="form-control field" name="key1" rows="3" data-fieldtype="test" data-group="">demo</textarea>
</div>
<div class="col-md-1 col-sm-2 col-xs-2 pad pointer movefield" data-key="1">
<div><span class="glyphicon glyphicon-arrow-up"></span></div>
</div>
<div class="col-md-1 col-sm-2 col-xs-2 pad pointer setting" data-key="1">
<div><span class="glyphicon glyphicon-cog">click me</span></div>
</div>
<div class="col-md-1 col-sm-2 col-xs-2 pad pointer field-remove" data-key="1">
<div>x</div>
</div>
</div>
现在的问题是没有得到 data-fieldtype
的值,因为这个方法是 returns undefined
。
并且还建议获取 data-group
的值,因为目前这个是空白的
因为 textarea
不是 .setting
的父级。它的父项是 #field
,您应该在其中找到 textarea。
$(this).parent().find('[data-fieldtype]').data('fieldtype')
$(document).on('click', '.setting', function(e){
console.log(
$(this).parent().find('[data-fieldtype]').data('fieldtype')
);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="row" id="field">
<div class="col-md-9 col-sm-6 col-xs-6 pad" style="">
<textarea class="form-control field" name="key1" rows="3" data-fieldtype="test" data-group="">demo</textarea>
</div>
<div class="col-md-1 col-sm-2 col-xs-2 pad pointer movefield" data-key="1">
<div><span class="glyphicon glyphicon-arrow-up"></span></div>
</div>
<div class="col-md-1 col-sm-2 col-xs-2 pad pointer setting" data-key="1">
<div><span class="glyphicon glyphicon-cog">click me</span></div>
</div>
<div class="col-md-1 col-sm-2 col-xs-2 pad pointer field-remove" data-key="1">
<div></div>
</div>
</div>