我有一个列表,其中包含x列数据。单击行中的编辑按钮时,我想设置此行每列的html内容,该列在数组中有一个name属性,该键由columns name attributes值命名。
data['id'] = '123';
data['name'] = 'John Doe';
data['city'] = 'Arlington';
为此,我在edit div上启动了一个click事件。在这个函数中,我使用$(this)选择器在所有具有name属性的元素上设置一个each()循环。
在这个循环中,我再次用$(this)选择器捕获每个匹配元素的名称和值。
所以,我的问题是:尽管它有效——它允许这样做吗?在同一个函数中为两个不同的对象使用$(this)?
有别的办法吗?
这是我的工作示例代码
$( document ).ready(function() {
$(document).on( "click", ".edit", function() {
var data = {};
$(this).closest('.row').children('div[name]').each(function() {
//form_data.append($(this).attr('name'), $(this).html());
data[$(this).attr('name')] = $(this).html();
});
$('#result').html(JSON.stringify(data, null, 4));
});
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="row">
<div name="id">123</div>
<div name="name">John Doe</div>
<div name="city">Berlin</div>
<div class="edit">> edit <</div>
</div>
<br clear="all">
<div id="result"></div>