Javascript 从DOM jQuery添加输入后，Bootstrap 4模式滚动不起作用

我使用的是Bootstrap4模式，我有一个类似这样的UI

如您所见，我有问题标签和添加问题，通过点击添加问题，我可以通过jQuery添加新的输入框。这是我如何添加新问题的代码

$(document.body).on("click",".addSingle",function(){

       var appendX = '<div class="actionBtn"><div class="BtnIcon removeBtn removeSingle" title="Delete this choice."><svg class="svd-svg-icon" style="width: 16px; height: 16px;"><use xlink:href="#icon-inplaceplus"><symbol viewBox="0 0 12 12" id="icon-inplaceplus"><path d="M11 5H7V1H5v4H1v2h4v4h2V7h4z"></path></symbol></use></svg></div></div>';


       $(this).closest(".question_editable").find(".question:first").clone().find("input:text").val("").end().insertAfter($(this).closest(".question_editable").find(".question:last")).append(appendX);





   });

---

有人能指导我怎么解决这个问题吗

如果您可以在jsfiddle中复制类似的东西，让其他人检查是什么导致了这个问题，那将是很有帮助的

---

您可以尝试的一个选项是，仅将溢出设置到“问题”部分，而不是模式部分，然后查看是否按预期工作

需要查看您的

.question\u editable

标记。可能：{overflow-y:auto！important；}@EternalHour我已经添加了。html不包含

.question\u editable

类。@EternalHour是的

add

和

edit

问题页面的唯一相同代码。所以我不认为这是问题的根源，所以我没有把问题放在这里。

<div class="modal fade" id="questionModal" tabindex="-1" role="dialog" aria-labelledby="questionModal"
   aria-hidden="true">
   <div class="modal-dialog modal-dialog-centered modalcustom" role="document">
      <div class="modal-content">
         <div class="modal-header">
            <h5 class="modal-title">Add Question</h5>
            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
            <span aria-hidden="true">&times;</span>
            </button>
         </div>
         <form role="form" method="POST" action="" novalidate id="questionModalfrm">
            @csrf
            <div class="modal-body">
            </div>
            <div class="modal-footer">
               <button type="submit" class="btn btn-br-success  btn-s-md  waves-effect waves-light">Add</button>
               <button type="button" class="btn btn-danger  btn-s-md  waves-effect waves-light" data-dismiss="modal">Cancel</button>
            </div>
         </form>
      </div>
   </div>
</div>

<div class="modal fade" id="questionModalEdit" tabindex="-1" role="dialog" aria-labelledby="questionModalEdit"
   aria-hidden="true">
   <div class="modal-dialog modal-dialog-centered modalcustom" role="document">
      <div class="modal-content">
         <div class="modal-header">
            <h5 class="modal-title">Edit Question</h5>
            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
            <span aria-hidden="true">&times;</span>
            </button>
         </div>
         <form role="form" method="POST" action="" novalidate id="questionModalEditfrm">
            @csrf
            <div class="modal-body">
            </div>
            <div class="modal-footer">
               <button type="submit" class="btn btn-br-success  btn-s-md  waves-effect waves-light">Save</button>
               <button type="button" class="btn btn-danger  btn-s-md  waves-effect waves-light" data-dismiss="modal">Cancel</button>
            </div>
         </form>
      </div>
   </div>
</div>