[javascript] load Js file in HTML

My first PhoneGap application includes 2 HTML files.

The first one is named index.html which uses index.js. This file will display a list item. When I click an item in that list, it brings me to detail.html file by this:

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

OR

   location.href = "detail.html";

On the detail.html page, I load detal.js. However it did not work. I could not use functions in detail.js.

Please give me your advise and there are any example ?

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>

This question is related to javascript cordova

The answer is


I had the same problem, and found the answer. If you use node.js with express, you need to give it its own function in order for the js file to be reached. For example:

const script = path.join(__dirname, 'script.js');
const server = express().get('/', (req, res) => res.sendFile(script))

If this is your detail.html I don't see where do you load detail.js? Maybe this

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

should be this

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

?