如何导入.js文件

时间:2012-07-07 06:50:29

标签: jquery jquery-ui jquery-mobile cordova

您好我正在开发phonegap应用程序。如果我在index.html文件中使用console.log然后打印,但如果我在另一个文件中使用它,则不会打印。如果我想在index.html文件中导入文件,如:

<!DOCTYPE html>

<html>

<head>  

    <link rel="stylesheet" href="jquery.mobile/jquery.mobile-1.1.0.css" />
    <link rel="stylesheet" href="docs/assets/css/jqm-docs.css" />
    <link rel="stylesheet" href="docsdemos-style-override.css" />


    <script type="text/javascript" charset="utf-8" src="cordova-1.6.1.js"></script>             
    <script type="text/javascript" src="jquery.mobile/jquery-1.7.2.min"></script>       
    <script type="text/javascript" src="jquery.mobile/jqm.autoComplete-1.4.js"></script>    
    <script type="text/javascript" src="jquery.mobile/jquery.mobile-1.1.0.js"></script>

    <script type="text/javascript">

        console.log("!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!");
    </script>

</head>

<body>

<div data-role="page" id="home" data-add-back-btn="true">
    <div data-role="content" >

        <a href="UI/Equity/test.html" data-role="button" id="myButton">index</a>            

    </div>
</div>



</body>
</html>

然后页面显示按钮并打印!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!但是点击按钮会显示test.html文件,如:

<!DOCTYPE html>

<html>

<head>  

    <link rel="stylesheet" href="jquery.mobile/jquery.mobile-1.1.0.css" />
    <link rel="stylesheet" href="docs/assets/css/jqm-docs.css" />
    <link rel="stylesheet" href="docsdemos-style-override.css" />


    <script type="text/javascript" charset="utf-8" src="cordova-1.6.1.js"></script>             
    <script type="text/javascript" src="jquery.mobile/jquery-1.7.2.min"></script>       
    <script type="text/javascript" src="jquery.mobile/jqm.autoComplete-1.4.js"></script>    
    <script type="text/javascript" src="jquery.mobile/jquery.mobile-1.1.0.js"></script>

    <script type="text/javascript">

        console.log("@@@@@@@@@@@@@@@@@@@@@@@@@@@@");
    </script>

</head>

<body>

<div data-role="page" id="home" data-add-back-btn="true">
    <div data-role="content" >

        <a href="#" data-role="button" id="myButton">Test</a>           

    </div>
</div>



</body>
</html>

但是这里没有打印@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@

2 个答案:

答案 0 :(得分:3)

  

当你有不同HTML文件的jQuery移动“页面”时,那是什么   框架确实抓住了data-role =“page”元素的内容   并将其插入当前页面的DOM中。

     

完全忽略不在该data-role =“page”元素中的任何内容。   这意味着,只是第一页头部的脚本   命中(在这种情况下是index.html)实际上是下载的   运行,这就是为什么你的脚本需要在所有头部引用   所有页面。

检查PageCreate事件here

OR

另一种选择是强制刷新页面以便执行第2页中的脚本,您可以通过设置来执行此操作:

<div data-role="page" id="home" data-add-back-btn="true">
    <div data-role="content" >

        <a href="UI/Equity/test.html" data-ajax="false" data-role="button" id="myButton">index</a>            

    </div>
</div>

添加了数据-ajax =“false”

答案 1 :(得分:1)

您需要提供导入javascript文件的相对路径。您可能需要将其更改为impo

假设index.html的Test.html目录路径类似于

index.html
UI\Equity\Test.html 

<script type="text/javascript" charset="utf-8" src="../../cordova-1.6.1.js"></script>             
<script type="text/javascript" src="../../jquery.mobile/jquery-1.7.2.min"></script>       
<script type="text/javascript" src="../../jquery.mobile/jqm.autoComplete-1.4.js"></script>    
<script type="text/javascript" src="../../jquery.mobile/jquery.mobile-1.1.0.js"></script>