麻烦在页面之间导航8.1- javascript

时间:2016-02-04 03:50:51

标签: javascript html navigation windows-phone-8.1

我正在尝试使用HTML / JS在Windows 8.1中的页面之间导航。我可以在主屏幕和车辆屏幕之间导航,然后我也可以在主屏幕和部分屏幕之间导航。我无法从车辆屏幕导航到零件屏幕,反之亦然。此外,如果我从家到车到家,我无法进入零件屏幕。我正在使用按钮进行导航......

首页

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Home Page</title>

<!-- WinJS references -->
<script src="//Microsoft.Phone.WinJS.2.1/js/base.js"></script>
<script src="//Microsoft.Phone.WinJS.2.1/js/ui.js"></script>

<link href="/css/default.css" rel="stylesheet" />
<link href="/pages/home/home.css" rel="stylesheet" />
<script src="/pages/home/home.js"></script>
</head>
<body>
<!-- The content that will be loaded and displayed. -->
<div class="fragment homepage">        
    <header aria-label="Header content" role="banner">
        <h1 class="titlearea win-type-ellipsis">
            <div class="pagetitle">Vehicle Inventory</div>
        </h1>
    </header>
    <section aria-label="Main content" role="main">
        <h3 class="pageDesc">Choose Item to Add/Update/Delete</h3>
        <div class="option-btn-home">
            <button class="normal-btn-home" id="vehicle-btn">Vehicle</button>
            <button class="normal-btn-home" id="part-btn">Part</button>
        </div>
    </section>
</div>
</body>
</html>

Vehicle和PAge屏幕类似于主页html。

首页js:

(function () {
"use strict";

WinJS.UI.Pages.define("/pages/home/home.html", {
    ready: function (element, options) {
        //navigates to vehicle page
        document.getElementById('vehicle-btn').onclick = function (event) {
            WinJS.Navigation.navigate("/pages/vehicle/vehicle.html");
        }
        //navigates to part page
        document.getElementById('part-btn').onclick = function (event) {
            WinJS.Navigation.navigate("/pages/part/part.html");
        }
    }
});
})();

车辆屏幕js:

(function () {
"use strict";

WinJS.UI.Pages.define("/pages/vehicle/vehicle.html", {
    ready: function (element, options) {
        //navigates to home page
        document.getElementById('home-btn').onclick = function (event) {
            WinJS.Navigation.navigate("/pages/home/home.html");
        }
        //navigates to part page
        document.getElementById('part-btn').onclick = function (event) {
            WinJS.Navigation.navigate("/pages/part/part.html");
        }
    }
});
})();

部分屏幕js:

(function () {
"use strict";

WinJS.UI.Pages.define("/pages/part/part.html", {
    ready: function (element, options) {
        //navigates to home page
        document.getElementById('home-btn').onclick = function (event) {
            WinJS.Navigation.navigate("/pages/home/home.html");
        }
        //navigates to vehicle page
        document.getElementById('vehicle-btn').onclick = function (event) {
            WinJS.Navigation.navigate("/pages/vehicle/vehicle.html");
        }
    }
});
})();

感谢所有帮助!

1 个答案:

答案 0 :(得分:0)

所以我修好了,但我不确定它为什么现在有效。这是我的新javascript代码:

// Karma configuration
// http://karma-runner.github.io/0.10/config/configuration-file.html

module.exports = function (config) {
config.set({
    // base path, that will be used to resolve files and exclude
    basePath: '../../',

    // testing framework to use (jasmine/mocha/qunit/...)
    frameworks: ['jasmine'],

    // list of files / patterns to load in the browser
    files: [
        // bower:js
        'main/webapp/bower_components/es5-shim/es5-shim.js',
        'main/webapp/bower_components/jquery/dist/jquery.js',
        'main/webapp/bower_components/angular/angular.js',
        'main/webapp/bower_components/angular-animate/angular-animate.js',
        'main/webapp/bower_components/angular-aria/angular-aria.js',
        'main/webapp/bower_components/angular-bootstrap/ui-bootstrap-tpls.js',
        'main/webapp/bower_components/bootstrap/dist/js/bootstrap.js',
        'main/webapp/bower_components/angular-bootstrap-nav-tree/dist/abn_tree_directive.js',
        'main/webapp/bower_components/angular-file-upload/angular-file-upload.js',
        'main/webapp/bower_components/angular-messages/angular-messages.js',
        'main/webapp/bower_components/skycons/skycons.js',
        'main/webapp/bower_components/angular-skycons/angular-skycons.js',
        'main/webapp/bower_components/angular-smart-table/dist/smart-table.min.js',
        'main/webapp/bower_components/angular-touch/angular-touch.js',
        'main/webapp/bower_components/angular-cache-buster/angular-cache-buster.js',
        'main/webapp/bower_components/angular-cookies/angular-cookies.js',
        'main/webapp/bower_components/angular-dynamic-locale/src/tmhDynamicLocale.js',
        'main/webapp/bower_components/angular-local-storage/dist/angular-local-storage.js',
        'main/webapp/bower_components/angular-loading-bar/build/loading-bar.js',
        'main/webapp/bower_components/angular-resource/angular-resource.js',
        'main/webapp/bower_components/angular-sanitize/angular-sanitize.js',
        'main/webapp/bower_components/angular-translate/angular-translate.js',
        'main/webapp/bower_components/messageformat/messageformat.js',
        'main/webapp/bower_components/angular-translate-interpolation-messageformat/angular-translate-interpolation-messageformat.js',
        'main/webapp/bower_components/angular-translate-loader-partial/angular-translate-loader-partial.js',
        'main/webapp/bower_components/angular-translate-loader-static-files/angular-translate-loader-static-files.js',
        'main/webapp/bower_components/angular-translate-storage-cookie/angular-translate-storage-cookie.js',
        'main/webapp/bower_components/angular-translate-storage-local/angular-translate-storage-local.js',
        'main/webapp/bower_components/angular-ui-router/release/angular-ui-router.js',
        'main/webapp/bower_components/moment/moment.js',
        'main/webapp/bower_components/fullcalendar/dist/fullcalendar.js',
        'main/webapp/bower_components/angular-ui-calendar/src/calendar.js',
        'main/webapp/bower_components/angular-ui-grid/ui-grid.js',
        'main/webapp/bower_components/angular-ui-select/dist/select.js',
        'main/webapp/bower_components/angular-ui-utils/ui-utils.js',
        'main/webapp/bower_components/angular-xeditable/dist/js/xeditable.js',
        'main/webapp/bower_components/angularjs-toaster/toaster.js',
        'main/webapp/bower_components/angular-strap/dist/angular-strap.js',
        'main/webapp/bower_components/angular-strap/dist/angular-strap.tpl.js',
        'main/webapp/bower_components/angular-recaptcha/release/angular-recaptcha.js',
        'main/webapp/bower_components/bootstrap-daterangepicker/daterangepicker.js',
        'main/webapp/bower_components/bootstrap-filestyle/src/bootstrap-filestyle.js',
        'main/webapp/bower_components/bootstrap-slider/bootstrap-slider.js',
        'main/webapp/bower_components/bootstrap-tagsinput/dist/bootstrap-tagsinput.js',
        'main/webapp/bower_components/bootstrap-wysiwyg/bootstrap-wysiwyg.js',
        'main/webapp/bower_components/bower-jvectormap/jquery-jvectormap-1.2.2.min.js',
        'main/webapp/bower_components/datatables/media/js/jquery.dataTables.js',
        'main/webapp/bower_components/flot/jquery.flot.js',
        'main/webapp/bower_components/flot-spline/js/jquery.flot.spline.js',
        'main/webapp/bower_components/flot.tooltip/js/jquery.flot.tooltip.js',
        'main/webapp/bower_components/footable/js/footable.js',
        'main/webapp/bower_components/html5sortable/jquery.sortable.js',
        'main/webapp/bower_components/json3/lib/json3.js',
        'main/webapp/bower_components/ng-grid/build/ng-grid.js',
        'main/webapp/bower_components/intl-tel-input/build/js/intlTelInput.min.js',
        'main/webapp/bower_components/intl-tel-input/lib/libphonenumber/build/utils.js',
        'main/webapp/bower_components/ng-intl-tel-input/dist/ng-intl-tel-input.js',
        'main/webapp/bower_components/ngImgCrop/compile/minified/ng-img-crop.js',
        'main/webapp/bower_components/ngstorage/ngStorage.js',
        'main/webapp/bower_components/ng-file-upload/ng-file-upload.js',
        'main/webapp/bower_components/ngInfiniteScroll/build/ng-infinite-scroll.js',
        'main/webapp/bower_components/oclazyload/dist/ocLazyLoad.min.js',
        'main/webapp/bower_components/screenfull/dist/screenfull.js',
        'main/webapp/bower_components/slimscroll/jquery.slimscroll.min.js',
        'main/webapp/bower_components/textAngular/dist/textAngular.min.js',
        'main/webapp/bower_components/venturocket-angular-slider/build/angular-slider.js',
        'main/webapp/bower_components/videogular/videogular.js',
        'main/webapp/bower_components/videogular-buffering/buffering.js',
        'main/webapp/bower_components/videogular-controls/controls.js',
        'main/webapp/bower_components/videogular-ima-ads/ima-ads.js',
        'main/webapp/bower_components/videogular-overlay-play/overlay-play.js',
        'main/webapp/bower_components/videogular-poster/poster.js',
        'main/webapp/bower_components/waves/dist/waves.min.js',
        'main/webapp/bower_components/angular-mocks/angular-mocks.js',
        // endbower
        'main/webapp/scripts/app/app.js',
        'main/webapp/scripts/app/**/*.+(js|html)',
        'main/webapp/scripts/components/**/*.+(js|html)',
        'test/javascript/spec/helpers/module.js',
        'test/javascript/spec/helpers/httpBackend.js',
        'test/javascript/**/!(karma.conf|protractor.conf).js'
    ],


    // list of files / patterns to exclude
    exclude: ['test/javascript/e2e/**'],

    preprocessors: {
        './main/webapp/scripts/**/*.js': ['coverage'],
        '**/*.html': ['ng-html2js']
    },

    reporters: ['dots', 'jenkins', 'coverage', 'progress'],

    jenkinsReporter: {

        outputFile: '../build/test-results/karma/TESTS-results.xml'
    },

    coverageReporter: {

        dir: '../build/test-results/coverage',
        reporters: [
            {type: 'lcov', subdir: 'report-lcov'}
        ]
    },

    // web server port
    port: 9876,

    // level of logging
    // possible values: LOG_DISABLE || LOG_ERROR || LOG_WARN || LOG_INFO || LOG_DEBUG
    logLevel: config.LOG_INFO,

    // enable / disable watching file and executing tests whenever any file changes
    autoWatch: false,

    // Start these browsers, currently available:
    // - Chrome
    // - ChromeCanary
    // - Firefox
    // - Opera
    // - Safari (only Mac)
    // - PhantomJS
    // - IE (only Windows)
    browsers: ['PhantomJS'],

    // Continuous Integration mode
    // if true, it capture browsers, run tests and exit
    singleRun: true,

    // to avoid DISCONNECTED messages when connecting to slow virtual machines
    browserDisconnectTimeout : 10000, // default 2000
    browserDisconnectTolerance : 1, // default 0
    browserNoActivityTimeout : 4*60*1000 //default 10000
});
};