$(() => {
$("#responseType").click(function(){
var link = $(this).parent('div').prev().attr('data-type');
console.log(link);
})
});<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="documentWrapper" class="document-wrapper" tabindex="-1"><div class="document ui-selectable">
<div class="element-selection question-selection ui-selectee" data-type="question">What are your short and long-term goals? How do you plan to use your MBA?</div>
<div class="element-selection response-selection ui-selectee" data-type="response">Your short-term goals should be concrete and achievable, and your long-term goals should fit well with your passions and personality.</div>
<div class="element-selection question-selection ui-selectee" data-type="question">How will you contribute to our campus?</div>
<div class="element-selection response-selection ui-selectee" data-type="response">Mention clubs and leaderships opportunities that you are interested in, and highlight any unique passions that you would bring to the student body.</div>
<div class="element-selection question-selection ui-selectee" data-type="question1">What is your biggest strength? Your biggest weakness?</div>
<div id="kbSelectionMenu">
<label >
<input type="radio" name="import-type" id="questionType" value="question">
<label for="questionType">Question</label>
</label>
<label class="radio">
<input type="radio" name="import-type" id="responseType" value="response">
<label for="responseType" class="ui-selectee">Response</label>
</label>
</div></div>
<p class="Normal DocDefaults data-selection ui-selectee"> </p></div></div>在上面的html中有一些单选按钮。单击单选按钮时，我想获得单选按钮的父div之前的div的属性"data type"。
我们尝试了上面的Jquery代码。此代码返回当前div的属性"datatype"，而不是以前的属性。
.parent()选择元素的父元素，但您需要使用.closest()从父元素集中选择与选择器匹配的第一个元素。
$("#responseType").click(function(){
var link = $(this).closest('div').prev().attr('data-type');
console.log(link);
});
$("#responseType").click(function(){
var link = $(this).closest('div').prev().attr('data-type');
console.log(link);
})<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="documentWrapper" class="document-wrapper" tabindex="-1"><div class="document ui-selectable">
<div class="element-selection question-selection ui-selectee" data-type="question">What are your short and long-term goals? How do you plan to use your MBA?</div>
<div class="element-selection response-selection ui-selectee" data-type="response">Your short-term goals should be concrete and achievable, and your long-term goals should fit well with your passions and personality.</div>
<div class="element-selection question-selection ui-selectee" data-type="question">How will you contribute to our campus?</div>
<div class="element-selection response-selection ui-selectee" data-type="response">Mention clubs and leaderships opportunities that you are interested in, and highlight any unique passions that you would bring to the student body.</div>
<div class="element-selection question-selection ui-selectee" data-type="question1">What is your biggest strength? Your biggest weakness?</div>
<div id="kbSelectionMenu">
<label >
<input type="radio" name="import-type" id="questionType" value="question">
<label for="questionType">Question</label>
</label>
<label class="radio">
<input type="radio" name="import-type" id="responseType" value="response">
<label for="responseType" class="ui-selectee">Response</label>
</label>
</div>
</div>
<p class="Normal DocDefaults data-selection ui-selectee"> </p>
</div>.parent()匹配当前匹配元素集中每个元素的父元素。在HTML结构中，单选的父级是您要查找的label元素，而不是div。
尝试使用.closest()，它通过测试元素本身并在DOM树中遍历其祖先来匹配与选择器匹配的第一个元素。
请注意：
最好使用.data()来获取/设置元素的命名数据存储中的值。
var link = $(this).closest('div').prev().data('type');
$(() => {
$("#responseType").click(function(){
console.log($(this).parent().get(0).nodeName); // LABEL
var link = $(this).closest('div').prev().data('type');
console.log(link);
})
});<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="documentWrapper" class="document-wrapper" tabindex="-1"><div class="document ui-selectable">
<div class="element-selection question-selection ui-selectee" data-type="question">What are your short and long-term goals? How do you plan to use your MBA?</div>
<div class="element-selection response-selection ui-selectee" data-type="response">Your short-term goals should be concrete and achievable, and your long-term goals should fit well with your passions and personality.</div>
<div class="element-selection question-selection ui-selectee" data-type="question">How will you contribute to our campus?</div>
<div class="element-selection response-selection ui-selectee" data-type="response">Mention clubs and leaderships opportunities that you are interested in, and highlight any unique passions that you would bring to the student body.</div>
<div class="element-selection question-selection ui-selectee" data-type="question1">What is your biggest strength? Your biggest weakness?</div>
<div id="kbSelectionMenu">
<label >
<input type="radio" name="import-type" id="questionType" value="question">
<label for="questionType">Question</label>
</label>
<label class="radio">
<input type="radio" name="import-type" id="responseType" value="response">
<label for="responseType" class="ui-selectee">Response</label>
</label>
</div>
</div>
<p class="Normal DocDefaults data-selection ui-selectee"> </p>
</div>如果您真的想使用parent()，那么您必须转到DOM树中的另一个级别：
var link = $(this).parent().parent('div').prev().data('type');
$(() => {
$("#responseType").click(function(){
var link = $(this).parent().parent('div').prev().data('type');
console.log(link);
});
});<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="documentWrapper" class="document-wrapper" tabindex="-1"><div class="document ui-selectable">
<div class="element-selection question-selection ui-selectee" data-type="question">What are your short and long-term goals? How do you plan to use your MBA?</div>
<div class="element-selection response-selection ui-selectee" data-type="response">Your short-term goals should be concrete and achievable, and your long-term goals should fit well with your passions and personality.</div>
<div class="element-selection question-selection ui-selectee" data-type="question">How will you contribute to our campus?</div>
<div class="element-selection response-selection ui-selectee" data-type="response">Mention clubs and leaderships opportunities that you are interested in, and highlight any unique passions that you would bring to the student body.</div>
<div class="element-selection question-selection ui-selectee" data-type="question1">What is your biggest strength? Your biggest weakness?</div>
<div id="kbSelectionMenu">
<label >
<input type="radio" name="import-type" id="questionType" value="question">
<label for="questionType">Question</label>
</label>
<label class="radio">
<input type="radio" name="import-type" id="responseType" value="response">
<label for="responseType" class="ui-selectee">Response</label>
</label>
</div>
</div>
<p class="Normal DocDefaults data-selection ui-selectee"> </p>
</div>