如何加载.html页面,然后立即在屏幕上显示该页面的内容?

时间:2018-12-19 14:35:59

标签: javascript jquery twitter-bootstrap

我有modal.html页,其中存储了所有模态供我的应用程序使用。但是,我需要在该文件的页面加载中使用一种模式。这是我的代码示例:

$(document).ready(function(){
    $("#modals").load("includes/modals.html");
    $("#welcome").modal('show');
});

以下是html主页的示例:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>My App</title>
    <link rel="stylesheet" type="text/css" href="bootstrap/css/bootstrap.min.css">
</head>
<body>
   <div class="container">
      Main Page Content
   </div>
   <div id="modals"></div>
</body>
</html>

我猜这里的问题是modals.html在触发.modal('show');之前没有完全加载。另一种方法是从modals.html中移动模式代码,并将其放在主体的按钮上。我想知道是否有一种方法可以从单独的文件中使它工作。这样可以使我的代码更整洁,但是如果有任何这种方式的缺点,请告诉我。

0 个答案:

没有答案