0

我正在尝试使用 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');
    });
  });
});

我错过了什么?有更好的方法吗?提前致谢。

4

0 回答 0