Question

好的，所以这个会变得很糟糕！

注意：这将适用于运行sqlite和mongoose的Windows桌面应用程序，因此加载时间不是那么重要（对我而言），并且不会连接到非本地服务器。

我已经搜遍了所有并且无法找到任何特定于我的情况的内容，大多数似乎都会加载到iframe或使用css-tricks.com提供的框架

我正在使用自己的（sorta）框架。我使用的库是bootstrap 3，jquery 2.1.4，jqueryui 1.12.1和Bootstrap-select v1.12.1

index.php将所有内容动态加载到div＃wrapper中，并将充当所有页面加载的头部。这是我的index.php的骨架。在sidebar.html中，链接具有属性＆＃39; pagetoload＆＃39;，jquery捕获click事件并将数据加载到div＃wrapper

    <body>
      <?php require_once("res/sidebar.html"); ?>
      <div class="container-fluid" id="body-container">
        <div id="wrapper" style="border:1px black solid;">
           <!-- dynamic page content will be loaded here-->
        </div>
      </div>

      <script src="res/js/jquery.js"></script>
      <script src="res/js/jquery-ui.js"></script>
      <script src="res/js/bootstrap.js"></script>
      <script src="res/js/bootstrap-select.js"></script>
      <script src="res/js/menu-handling.js"></script>



    <script>
    //index.php js
    $(document).ready(function () {

        $.get("home.php", function (data) {
            $("div#wrapper").html(data);
        });


        $("a.loader").click(function (e) {
            e.preventDefault();
            $.get($(this).attr("pagetoload"), function (data) {
                $("div#wrapper").html(data);
            });
        });
        //dateFormat 10/dd/yy to constrain input only to october
        //get current month number and constrain to prevent additions to wrong month
        $("#date-input").datepicker({
            dateFormat: "12/dd/yy"
            , constrainInput: true
        });
        $("#date-input").focus(function () {
            $(this).datepicker("show");
        });

    });
</script>
</body>

每个将动态加载的页面理想情况下都包含最少的php，并且只包含该页面所需的html / css / js。我的问题是，例如，在加载一个页面，如我的dbviewer.php（包含js并给我异步加载警告）并将home.php重新加载到容器后，javascript不再有效。每个页面的javascript都是内联标记。

我已经尝试将每个动态页面的所有javascript打包到index.php中，以便它在启动时全部加载，但问题是它仍然无法正常工作。在每个页面模块化的情况下，这种动态加载的最佳方法是什么？我试图研究这个，但只有像使用hashTag这样的东西出现了。

如果你需要我文件中的更多代码，请发帖，我想我已经解释得足以让你理解，因为在index.php之外没有什么太疯狂了。只是每个动态页面内的脚本基本上与之交互使用jquery的dom元素。

Answer 1

我离开这个答案是因为它对你有帮助，而且对于任何可能发现自己处于类似情况的开发人员来说，作为一般经验法则也是有用的。

因此，在开发应用程序时，您必须将主文件中的所有javascript，css资产分开，以便在第一个页面加载时托管它们。（也许它的表现会更好）

所有其他服务器生成的文件（php，node.js等）文件结构只是用户点击或降落的页面的数据源..或者至少尝试.. < / p>

之后你必须触发

$.ajax().callback

在前端上运行以在每个页面上执行作业。如页面效果，数据操作等。回调非常重要，因为实际上加载了数据！

欢呼，k

jQuery动态页面加载 - 其他javascript被破坏，我应该如何导入页面特定的js？

1 个答案: