您好，我的这张桌子上有一些按钮，我想找到最接近的按钮并在其上设置数据属性，但是相反，它将找到具有该类的所有按钮，并且设置数据属性不起作用……嗯，您能帮我吗？
https://jsfiddle.net/gkgmmahj/
//I'm looking for class .query-single-answer
$(document).on('change', '#select-headquarter', changeHeadquarter);
function changeHeadquarter() {
console.log('fired');
// Check input( $( this ).val() ) for validity here
$("select option:selected").each(function() {
var select = $(this).val();
var survey = $(this).data('id');
var url;
var singleAnswer = $(this).closest('.query-for-single-answer');
singleAnswer.data('headquarter', select);
singleAnswer.data('id', survey);
console.log(singleAnswer);
});
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table class="table table-hover table-striped table-bordered table-responsive table-manager">
<thead>
<tr>
<td>Denumire</td>
<td>Sediu</td>
<td>Actiuni</td>
</tr>
</thead>
<tbody>
<tr>
<td>primul chestionar</td>
<td class="col-md-2">
<div class="form-group">
<select id="select-headquarter" name="selectbasic" class="form-control">
<option value="default">Alege Sediu</option>
<option value="1" data-id="1">Ploiesti</option>
</select>
</div>
</td>
<td class="table-fit-column">
<button class="btn btn-default query-for-single-answer" data-toggle="modal" data-target="#show-respondents-modal" data-id="" data-headquarter="" data-usernumber="" data-tooltip="tooltip" data-placement="top" title="" data-original-title="Raport Selectie Unica">
<span class="glyphicon glyphicon-stats" aria-hidden="true"></span>
</button>
<button class="btn btn-default query-for-report" data-toggle="modal" data-target="#show-respondents-modal" data-id="" data-headquarter="" data-usernumber="" data-tooltip="tooltip" data-placement="top" title="Raport Selectie Multipla">
<span class="glyphicon glyphicon-stats" aria-hidden="true"></span>
</button>
<button class="btn btn-default query-for-report" data-toggle="modal" data-target="#show-respondents-modal" data-id="" data-headquarter="" data-usernumber="" data-tooltip="tooltip" data-placement="top" title="Raport Selectie Unica Cu Punctaj">
<span class="glyphicon glyphicon-stats" aria-hidden="true"></span>
</button>
<button class="btn btn-default query-for-report" data-toggle="modal" data-target="#show-respondents-modal" data-id="" data-headquarter="" data-usernumber="" data-tooltip="tooltip" data-placement="top" title="Raport Selectie Multipla Cu Punctaj">
<span class="glyphicon glyphicon-stats" aria-hidden="true"></span>
</button>
<button class="btn btn-default query-for-report" data-toggle="modal" data-target="#show-respondents-modal" data-id="" data-headquarter="" data-usernumber="" data-tooltip="tooltip" data-placement="top" title="Raport Selectie Intrebari Deschise">
<span class="glyphicon glyphicon-stats" aria-hidden="true"></span>
</button>
<a href="/app_dev.php/admin/report/list/questions/1/1" class="btn btn-default" data-tooltip="tooltip" data-placement="top" title="Vizualizare Raport Comentarii">
<span class="glyphicon glyphicon-comment" aria-hidden="true"></span>
</a>
</td>
</tr>
<tr>
<td>chestionar 2 intrebari</td>
<td class="col-md-2">
<div class="form-group">
<select id="select-headquarter" name="selectbasic" class="form-control">
<option value="default">Alege Sediu</option>
<option value="1" data-id="3">Ploiesti</option>
</select>
</div>
</td>
<td class="table-fit-column">
<button class="btn btn-default query-for-single-answer" data-toggle="modal" data-target="#show-respondents-modal" data-id="" data-headquarter="" data-usernumber="" data-tooltip="tooltip" data-placement="top" title="" data-original-title="Raport Selectie Unica">
<span class="glyphicon glyphicon-stats" aria-hidden="true"></span>
</button>
<button class="btn btn-default query-for-report" data-toggle="modal" data-target="#show-respondents-modal" data-id="" data-headquarter="" data-usernumber="" data-tooltip="tooltip" data-placement="top" title="Raport Selectie Multipla">
<span class="glyphicon glyphicon-stats" aria-hidden="true"></span>
</button>
<button class="btn btn-default query-for-report" data-toggle="modal" data-target="#show-respondents-modal" data-id="" data-headquarter="" data-usernumber="" data-tooltip="tooltip" data-placement="top" title="Raport Selectie Unica Cu Punctaj">
<span class="glyphicon glyphicon-stats" aria-hidden="true"></span>
</button>
<button class="btn btn-default query-for-report" data-toggle="modal" data-target="#show-respondents-modal" data-id="" data-headquarter="" data-usernumber="" data-tooltip="tooltip" data-placement="top" title="Raport Selectie Multipla Cu Punctaj">
<span class="glyphicon glyphicon-stats" aria-hidden="true"></span>
</button>
<button class="btn btn-default query-for-report" data-toggle="modal" data-target="#show-respondents-modal" data-id="" data-headquarter="" data-usernumber="" data-tooltip="tooltip" data-placement="top" title="Raport Selectie Intrebari Deschise">
<span class="glyphicon glyphicon-stats" aria-hidden="true"></span>
</button>
<a href="/app_dev.php/admin/report/list/questions/3/1" class="btn btn-default" data-tooltip="tooltip" data-placement="top" title="Vizualizare Raport Comentarii">
<span class="glyphicon glyphicon-comment" aria-hidden="true"></span>
</a>
</td>
</tr>
<tr>
<td>nicole-1</td>
<td class="col-md-2">
<div class="form-group">
<select id="select-headquarter" name="selectbasic" class="form-control">
<option value="default">Alege Sediu</option>
<option value="2" data-id="7">Bucuresti</option>
</select>
</div>
</td>
<td class="table-fit-column">
<button class="btn btn-default query-for-single-answer" data-toggle="modal" data-target="#show-respondents-modal" data-id="" data-headquarter="" data-usernumber="" data-tooltip="tooltip" data-placement="top" title="" data-original-title="Raport Selectie Unica">
<span class="glyphicon glyphicon-stats" aria-hidden="true"></span>
</button>
<button class="btn btn-default query-for-report" data-toggle="modal" data-target="#show-respondents-modal" data-id="" data-headquarter="" data-usernumber="" data-tooltip="tooltip" data-placement="top" title="Raport Selectie Multipla">
<span class="glyphicon glyphicon-stats" aria-hidden="true"></span>
</button>
<button class="btn btn-default query-for-report" data-toggle="modal" data-target="#show-respondents-modal" data-id="" data-headquarter="" data-usernumber="" data-tooltip="tooltip" data-placement="top" title="Raport Selectie Unica Cu Punctaj">
<span class="glyphicon glyphicon-stats" aria-hidden="true"></span>
</button>
<button class="btn btn-default query-for-report" data-toggle="modal" data-target="#show-respondents-modal" data-id="" data-headquarter="" data-usernumber="" data-tooltip="tooltip" data-placement="top" title="Raport Selectie Multipla Cu Punctaj">
<span class="glyphicon glyphicon-stats" aria-hidden="true"></span>
</button>
<button class="btn btn-default query-for-report" data-toggle="modal" data-target="#show-respondents-modal" data-id="" data-headquarter="" data-usernumber="" data-tooltip="tooltip" data-placement="top" title="Raport Selectie Intrebari Deschise">
<span class="glyphicon glyphicon-stats" aria-hidden="true"></span>
</button>
<a href="/app_dev.php/admin/report/list/questions/7/1" class="btn btn-default" data-tooltip="tooltip" data-placement="top" title="Vizualizare Raport Comentarii">
<span class="glyphicon glyphicon-comment" aria-hidden="true"></span>
</a>
</td>
</tr>
</tbody>
</table>最佳答案
closest的定义：
对于集合中的每个元素，通过测试元素本身并在DOM树中遍历其祖先，获得与选择器匹配的第一个元素。
因此，仅适用于父母。
如果要在同一tr中找到该按钮，则可以使用tr“转到”父$(this).closest('tr')，而不是按类.query-for-single-answer查找该按钮。
整行将是：
$(this).closest('tr').find('.query-for-single-answer')
关于javascript - 查找最接近的类并设置数据属性，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/40330560/