Question

我有两页。我想使用JS在两个页面上添加相同的页脚。

一个是index.html 第二个是add_dish.html

这是我的module.js

DCGAPP.DIV.FOOTER.createFooter = function(){
    var divBegin = '<div data-role="footer" data-id="tab" data-theme="a" data-position="fixed"><div data-role="navbar"><ul>'
    var menuFirst = '<li><a href="index.html">OPEN</a></li>'
    var menuSecond = '<li><a href="add_dish.html">ADD</a></li>'
    var divEnd = '</ul></div></div>'

    $('body').append(divBegin+menuFirst+menuSecond+divEnd);
}

我调用DCGAPP.DIV.FOOTER.createFooter（）;在main.js上

默认情况下首次加载index.html时，页脚已成功创建。但是，当我点击＆＃34; ADD＆＃34; （将我指向add_dish.html），未创建页脚 PS：即使我把我的脚本都移到头上，它也给了我相同的结果我的html都是一样的：

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <!-- Include meta tag to ensure proper rendering and touch zooming -->
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- Include jQuery Mobile stylesheets -->
    <link rel="stylesheet" href="css/jquery.mobile-1.4.5.min.css">
    <link rel="stylesheet" href="css/serverclient.min.css">
    <!-- Include the jQuery library -->
    <script src="js/jquery-2.1.4.min.js"></script>
    <!-- Include the jQuery Mobile library -->
    <script src="js/jquery.mobile-1.4.5.min.js"></script>
</head>
<body id="body">

    <div data-role="header">
        <h1>test</h1>
    </div>
    <!-- /header -->

    <div role="main" class="ui-content">
        test
    </div>
    <!-- /content -->

    <!-- /footer -->
<script src="js/module.js"></script>
<script src="js/main.js"></script>
</body>

Answer 1

你的module.js上的

修复你的代码（添加＃）。

$('#body').append(divBegin+menuFirst+menuSecond+divEnd);

也在你的add_dish.html上确保你的jquery包含在内。

body append不能在不同的页面上工作

1 个答案: