在HTML中加载Js文件

8

我的第一个PhoneGap应用包含两个HTML文件。

第一个文件名为index.html,它使用index.js。这个文件将显示一个列表项。当我点击列表中的一个项目时,它会通过以下方式带我到detail.html文件:

   $.mobile.changePage("detail.html", { transition: "slideup"}); 

或者

   location.href = "detail.html";

detail.html 页面上,我加载了 detail.js。但是它没有起作用,我无法使用 detail.js 中的函数。
请给我建议并提供任何示例?

Capture Photo

    <link rel="stylesheet" href="css/jquery.mobile.structure-1.3.0.min.css" />
    <link rel="stylesheet" href="css/jquery.mobile-1.3.0.min.css" />
    <link rel="stylesheet" href="css/getAbstract.min.css" />
    <script src="js/jquery-1.9.0.min.js"></script>
    <script src="js/jquery.mobile-1.3.0.min.js"></script>
    <script src="js/jquery.ba-dotimeout.js"></script>
    <script src="js/jquery.dst.js"></script>

    <script type="text/javascript" charset="utf-8" src="js/cordova-2.5.0.js"></script>
    <script type="text/javascript" charset="utf-8"></script>


</head>
<body>

    <div data-role = "page" data-theme = "a" id = "pageContainer">
        <!--Start Page Header -->
        <div data-role = "header" id = "pageHeader" data-nobackbtn = "true" data-position = "fixed">
            <h1>Camera</h1>
        </div>
        <!--End Page Header -->

        <!--Start Page Content-->
        <div data-role = "content" id= "pageContent">
            <a data-role = "button" id = "btnCaptureEdit" href = "">Capture Edit</a>
            <a data-role = "button" id = "btnLibraryPhoto" href = "">Get Photo From Library</a>
            <a data-role = "button" id = "btnAlbumPhoto" href = "">Get Photo From Album</a>
        </div>
        <!--End Page Content-->

        <!--Start Page Footer-->
        <div data-role = "footer" id = "pageFooter">
        </div>
        <!--End Page Footer-->

    </div>
    <script src="js/detail.js"></script>

</body>

</html>

3
请问能否提供代码?尤其是detail.html。 - Ilia Frenkel
所有的脚本标签都应该有类型属性。头部中最后一个脚本标签是空的,可以被移除。 - Surreal Dreams
2个回答

10
如果这是您的detail.html,我没有看到您在哪里加载detail.js?也许是这个原因。
<script src="js/index.js"></script>

应该是这样的

<script src="js/detail.js"></script>

?


我将<script src =“js/detail.js”> </script>加载到底部。你可以看到。 - Thuong Tran
当我在Web浏览器中运行detail.html文件时,它可以正常工作,但是当我在iPhone模拟器上运行时,它无法工作。 - Thuong Tran
我无法在detail.js文件中调用按钮事件。Detail.js文件内容如下:var btnCaptureVar = $('#btnCapture');btnCaptureVar.click(function() { alert("test"); }); - Thuong Tran
确保等待页面加载完成。使用 $(document).ready(function(){ <YOUR CODE HERE> }); - Ilia Frenkel
我使用了location.href = "detail.html"; 现在它可以工作了,因为mobile.changePage没有加载你的文件。 - Thuong Tran

0
我曾经遇到过同样的问题,并找到了答案。 如果你使用node.js和express,你需要为它提供自己的函数,以便js文件能够被访问。 例如:
const script = path.join(__dirname, 'script.js');
const server = express().get('/', (req, res) => res.sendFile(script))

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接