我正在尝试使用 jquery 和/或纯 javascript 将一个类添加到输入元素的伟大伟大伟大祖父母。这个想法是;单击当前步骤上的按钮 (class="ws-btn-previous") 后,将在上一步中将一个类添加到包含选定容量单选按钮的字段集中,然后淡入该字段集中,然后删除添加的类。
活动字段集的 HTML 如下;
<fieldset class="working_status ">
<h4 class="text-center">What is your Phone's condition?</h4>
<div class="container">
<div>
<ul class="h-ws row">
<li class="wsbf">
<input type="radio" class="sell-rdb" id="ws1" name="working_status" value="Excellent" />
<label class="ws-btn-labels" for="ws1">
<p id="wslbl">Excellent</p>
<p>Good as new. Has no dents or scratches.</p>
</label>
</li>
</ul>
</div>
</div>
<div class="container wizard-buttons">
<button type="button" class="btn btn-previous ws-btn-previous">Previous</button>
<button type="button" class="btn btn-next">Next</button>
</div>
</fieldset>
上一步中前一个字段集的HTML部分如下;
<fieldset class="capacity-gj7p">
<h4 class="text-center">Please select your Galaxy J7 Prime memory capacity</h4>
<div class="container">
<div>
<ul class="h-m row">
<li class="cbf">
<input type="radio" class="sell-rdb" id="sc49" name="capacity" value="32" />
<label class="capacity-btn-labels" for="sc49">32</label>
</li>
</ul>
</div>
</div>
<div class="container wizard-buttons">
<button type="button" class="btn btn-previous sc-btn-previous">Previous</button>
<button type="button" class="btn btn-next capacity-btn-next">Next</button>
</div>
</fieldset>
我尝试使用 jQuery 和纯 javascript 解决问题如下;
jQuery(document).ready(function() {
$('form .ws-btn-previous').on('click', function() {
var fset = document.getElementById("sell-wiz").elements["capacity"];
$(this).parents('fieldset').fadeOut(200, function() {
fset.addClass('capacity-parent');
$('.capacity-parent').fadeIn();
fset.removeClass('capacity-parent');
});
});
});
我错过了什么?有更好的方法吗?提前致谢。