jQuery在执行.show（）

Question

我试图在单击表格行时显示一个Web表单，以更新该行。单击另一个链接，就可以使用.show（）来显示模态窗口（图1）。

/ *这仅链接到具有js-open-modal类的标签* /

    $(".js-open-modal").click(function(){
         $(".modal").show();
    });     
    
    /* populate form with row attributes & show modal */
    
    $('tr').on('click', function() {
    
        var rowId = $(this).data('row');
        var rowText = $('tr[data-row=' + rowId + ']').text();
        var textArr = rowText.trim().split('\n');
    
        var formElement = "";
        $(textArr).each(function(i) {
          textArr[i] = $.trim(textArr[i]);
          console.log(i + ': ' + textArr[i]);
    
          formElement += '<input type="text" value="' + textArr[i] + '">\n';
        });
    
        var modal = $('.modal');
        modal.append(formElement);
        modal.show();
    });
   

.modal {
      display: none;
      position:fixed;
      top: 50%;
      left: 50%;
      transform:translate(-50%,-50%);
      background: #fff;
      width: 320px;
      height: 320px;
      text-align: center;
      box-sizing:border-box;
      box-shadow:0 0 20px rgba(0,0,0,.2);
    
      &.visible {
        display: block;
      }
    }
    
    .modal__header {
      color:white;
      background: #333;
      line-height: 50px;
      text-align: center;
      position: relative;
      height:50px;
      box-sizing:border-box;
    
      a {
        position: absolute;
        top: 0;
        right: 0;
        text-decoration: none;
        color:white;
        font-weight: bold;
        display: block;
        padding: 0 20px;
        font-size:16px;
        background: #555;
        height: 100%;
      }
    }

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="modal">
  <div class="modal__header">
    modal header
    <a href="#" class="js-close-modal">X</a>
  </div>
  <p>
    <form method="post" action="">
      <input type="submit" >
    </form>
  </p>
</div>
<a class="js-open-modal">
   Open Popup
</a>

现在，我正在尝试将html附加到我已经能够成功完成的表单中，因为单击行并单击创建的测试链接后，它将显示在模式窗口中。现在，单击该行将追加正确的html，但也没有显示我想要的模式。话虽这么说，如果我单击行之后单击我的模态测试链接，就可以看到我想要的填充的Web表单，问题是我希望所有这些都可以一键发生。对不起，我无法显示html在代码部分。这是一个div，其中的类是模态的，它包含一个表单元素。