Question

这是我今天的第二个问题，我真的希望你再次提供帮助。我写了一个包含文本字段的小程序。当用户输入他的电话号码时，我会做一些指示以最终计算某个参数，我想在点击提交按钮后在模态窗口上显示我的程序的最终结果。我认为这很简单，但我在编程方面比较新，这就是我遇到很多困难的原因。我用节点js编写了我的程序（但没有使用模板！所以程序很糟糕）但我的问题主要与我认为的html有关。这是我的计划：

{{1}}

Answer 1

我没有JS就开始简单。提交表单后，渲染一个只显示参数的页面。

然后，将模态标记添加到该页面：

<div id="my_modal" class="modal fade">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title">Modal Title</h4>
      </div>
      <div class="modal-body"></div>
    </div>
  </div>
</div>

之后，将jQuery提交侦听器附加到表单：

$('.form-horizontal').submit(function() {
  // do an AJAX get request for the page that's showing your parameter
  $.get(that_pages_url), function (data) {
    // set the modal's body to what the get request is returning
    $('#my_modal .modal-body').html(data);
    // show it
    $('#my_modal').modal('show');
  }

  // don't submit the form as normal, otherwise the user will be redirected
  return false;
});

提交表单后添加模态窗口

1 个答案: