Question

编辑：它与可能的重复项不一样，因为我已经解决了clone（）方法未复制元素的事实-正如我所怀疑的那样，这确实很la脚， prependTo太宽，正在将行复制到多个空格中，从而导致“ select”值被转移到网页中的错误位置。

我很确定我的问题的答案确实会很la脚和简单，但是我无法一辈子做到这一点。

完成表格后，我需要将整个行复制到div中以进行检查，然后再将信息添加到数据库中。

因此，完成后，我确保复制整行，添加“删除”按钮，并添加到审阅div上，但是当我能够复制其他所有内容时，select语句不会使用所选值进行复制。

我尝试使用普通的clone（），它不会复制值，然后尝试将值保存在变量中，然后将其添加到克隆的元素中（在添加之前），但不会也可以。

这是html代码：

<div class="tab-pane fade p-3" id="trucks-pane" role="tabpanel" aria-labelledby="trucks-tab">
    <div class="container-fluid mt-2">
      <div class="border p-2 rounded">
        <h6 class="show-hidden-form" role="button">Add Truck(s)<span class="float-right"><i class="fas fa-chevron-down text-secondary"></i></span> </h6>
        <div class="new-elements-form" style="display: none">
          <small class="text-secondary"><i>Start typing the driver's info, rows will populate automatically</i></small>
          <div class="d-flex flex-wrap new-element custom-input-group">
            <div class="mr-1 mb-1">
              <input type="text" class="form-control custom-input-element" name="" value="" autocomplete="new-password" placeholder="First Name">
            </div>
            <div class="mr-1 mb-1">
              <input type="text" class="form-control custom-input-element" name="" value="" autocomplete="new-password" placeholder="Last Name">
            </div>
            <div class="mr-1 mb-1">
              <input type="text" class="form-control custom-input-element datepicker" name="" value="" autocomplete="new-password" placeholder="Date of Birth">
            </div>
            <div class="mr-1 mb-1">
              <input type="text" class="form-control custom-input-element" name="" value="" autocomplete="new-password" placeholder="License Number">
            </div>
            <div class="mr-1 mb-1">
              <input type="text" class="form-control custom-input-element datepicker" name="" value="" autocomplete="new-password" placeholder="Date License Issued">
            </div>
            <div class="mr-1 mb-1">
              <input type="text" class="form-control custom-input-element datepicker" name="" value="" autocomplete="new-password" placeholder="Date License Expires">
            </div>
            <div class="mr-1 mb-1">
              <select class="form-control custom-input-element" name="">
                <option value="">Select Type</option>
                <option value="B1">B1</option>
                <option value="CDL">CDL</option>
              </select>
            </div>
          </div>
          <hr>
          <div class="added-elements">

            <div class="d-none add-elements-button">
              <button type="button" class="btn btn-primary" name="button">Add Truck(s)</button>
            </div>
          </div>
        </div>
      </div>
    </div>
    <div class="container-fluid mt-2">
      <div class="border p-2 rounded">
        <h6>Registered Trucks</h6>
      </div>
    </div>
  </div>

这是处理克隆的Javascript代码：

    if(all_filled){
      var delete_button = $("<div class='mr-1 mb-1 d-flex remove-element-line' role='button'><i class='far fa-times-circle text-danger align-self-center'></i></div>");
      var select_value = scope.find('.custom-input-group').find('select').val();
      var new_line = scope.find('.custom-input-group').clone();
      new_line.find('select').val(select_value);
      new_line.removeClass('custom-input-group').find('.custom-input-element').removeClass('is-valid').attr('disabled', true);
      new_line.prepend(delete_button);
      new_line.prependTo('.added-elements');
      scope.find('.custom-input-group').find('.custom-input-element').removeClass('is-valid is-invalid').val('').first().focus();
      scope.find('.add-elements-button').trigger('toggle-button');
    }

我在做什么错了？

为什么我的代码无法正确复制选择项？

0 个答案: