我们如何“处理”一个 Bootstrap 模态？答案

【问题标题】：How do we 'dispose' a Bootstrap modal?我们如何“处理”一个 Bootstrap 模态？
【发布时间】：2017-02-19 13:19:32
【问题描述】：

我正在开发一个小型应用程序来学习 AJAX 和 JavaScript。在这个我有方法saveData()，当点击save按钮时触发。一切正常，但我意识到页面正在刷新，所以我在网上搜索并找到了 JavaScript 方法 event.preventDefault()。这种方法效果很好。但这让我遇到了问题，我的模态对话框保持打开而不是关闭。再次，我发现hide 方法"close" 模态。这解决了它，但是当我单击打开模式时，它会将我发送到数据库的最新数据带给我。我来自 Java 背景，我开始认为 hide没有杀死模态。

我的问题：有没有一种方法可以完全破坏模式，就像在 Java 中使用 JFrame.dispose()method 完成的那样？

我使用的代码如下：

   function saveData(){
    var name=$('#nm').val();
    var email=$('#em').val();
    var phone=$('#hp').val();
    var address=$('#al').val();
    event.preventDefault();//prevent the page from refresh
    $.ajax({
       type:"post",
       url:"server.php?p=add",
       data:{nm:name,em:email,hp:phone,al:address},
       success: function(data){
        viewData();
        $('#addData').modal('hide');//close the modal.
       }
    });

  }

【问题讨论】：

添加按钮 type="button" 以防止刷新。
@ShalomPeles 我明白了，但现在要“处理”模态
你永远不会处理 Bootstrap 模态。你所能做的就是隐藏它并显示它

标签： javascript jquery ajax twitter-bootstrap

【解决方案1】：

您可以在每次打开模式时清除输入标签中的值。

【讨论】：

你知道怎么用jquery吧？在您的输入标签中添加一个 id。然后每次打开模式时都包含此代码 - $('#idOfYourInput').val(''); 以重置它。

【解决方案2】：

我已经遇到了清除所有值的模式的这个问题。但是我在隐藏模式后使用以下代码。

我的模态ID是#modal

$('#modal').hide();
$('#modal')
    .find("input,textarea,select")
       .val('')
       .end()
    .find("input[type=checkbox], input[type=radio]")
       .prop("checked", "")
       .end();

如果您有任何问题，可以参考可能对您有帮助的链接：How to clear all input fields in bootstrap modal when clicking data-dismiss button?

【讨论】：