Question

我是JavaScript新手。我不知道如何打开bootstrap模态。当我点击下面的按钮时它工作正常：

{'1. Reverse transcriptase/RNaseH': {'Actions': 'Inhibitor',
                                     'Gene Name': 'pol',
                                     'General Function': 'Rna-dna hybrid '
                                                         'ribonuclease '
                                                         'activity',
                                     'Kind': 'Protein',
                                     'Molecular Weight': '65223.615 Da',
                                     'Organism': 'Human immunodeficiency virus '
                                                 '1',
                                     'Pharmacological action': 'Yes',
                                     'Specific Function': 'Not Available',
                                     'Uniprot ID': 'Q72547',
                                     'Uniprot Name': 'Reverse '
                                                     'transcriptase/RNaseH'},
 '2. HLA class I histocompatibility antigen, B-57 alpha chain': {'Gene Name': 'HLA-B',
                                                                 'General Function': 'Involved '
                                                                                     'in '
                                                                                     'the '
                                                                                     'presentation '
                                                                                     'of '
                                                                                     'foreign '
                                                                                     'antigens '
                                                                                     'to '
                                                                                     'the '
                                                                                     'immune '
                                                                                     'system.',
                                                                 'Kind': 'Protein',
                                                                 'Molecular Weight': '40223.825 '
                                                                                     'Da',
                                                                 'Organism': 'Human',
                                                                 'Pharmacological action': 'Unknown',
                                                                 'Specific Function': 'Peptide '
                                                                                      'antigen '
                                                                                      'binding',
                                                                 'Uniprot ID': 'P18465',
                                                                 'Uniprot Name': 'HLA '
                                                                                 'class '
                                                                                 'I '
                                                                                 'histocompatibility '
                                                                                 'antigen, '
                                                                                 'B-57 '
                                                                                 'alpha '
                                                                                 'chain'}}

但是我想在没有用户事件的情况下打开它，它应该以编程方式打开。

我尝试使用<button type="button" class="btn btn-primary" data-toggle="modal" id="btnOpenPopup" data-target="#myModal"> Open modal </button>和$("#btnOpenPopup").click();，但它无效。

以下是我的模态。

(document.getElementById('btnOpenPopup')).click();

请帮帮我。提前谢谢。

Answer 1

试试这个。它为我工作。

如果您有登录按钮并且如果登录详细信息正确，则您要显示此弹出窗口。然后做这样的事情。

<button type="button" class="btn btn-primary" onclick="checkUserDetails()"> Login</button>

然后在你的脚本标签或你的js文件

function checkUserDetails() {
  // Check user details here 
  if (loginDetail) {  
    $("#YourModelName").show();   // show modal/popup
  } else {
    // do somethimg if logindetails is not valid
  }
}

希望对你有所帮助。

Answer 2

您可以使用modal()功能切换模态。

$("#myModal").modal(show | hide)

Bootstrap 3和4也是如此。

请参阅来源here。

Answer 3

对于Bootstrap 4.x，它看起来好像是

$('#myModal').modal('show')

来源：http://getbootstrap.com/docs/4.1/getting-started/javascript/

Answer 4

尝试将modal（）函数放在document.ready

中

$(document).ready(function() {
    $('#myModal').modal('show');
});

继续工作estimatr package

Answer 5

You can do it manually by .hide() and .show()

$(function(){
   $("#myModal").hide();
   $("#btnOpenPopup").click(function(){
         $("#myModal").show();
    });
 });

以编程方式显示Bootstrap模态窗口

5 个答案: