Jquery Mobile页面锚点页面工作不一致

时间:2017-01-30 18:16:41

标签: javascript jquery html cordova jquery-mobile

我有一个非常简单的页面,其中两个部分用a标识,并在同一页面上使用Jquery Mobile格式化链接进行链接(刷新率),并且它似乎不能一致地工作。

虽然我在PhoneGap应用程序中使用此功能,但当我尝试在Chrome中本地加载页面时会出现同样的问题。

<head>
    <title>TPS/TFS CAD Page</title>
<META NAME="ROBOTS" CONTENT="NOINDEX, NOFOLLOW">

    <meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="css/tfscad.mobile.css" />
<link rel="stylesheet" href="css/jquery.mobile-1.4.5.min.css">
<link rel="stylesheet" href="css/font-awesome.min.css">
<script src="js/jquery-1.11.1.min.js"></script>
<script src="js/jquery.mobile-1.4.5.min.js"></script>
<script src="js/js.cookie.js"></script> 
<script src="cordova.js"></script>

<script type='text/javascript'>

function save_val(va) {
        localStorage.setItem('refreshrate', va );
       var refreshrate=localStorage.getItem('refreshrate');

   alert('The refreshrate is set to ' + refreshrate);     
      }


</script>   


</head>


<body>

<div id="options" data-role="page">

<!-- Start of first page -->

    <div data-role="header">
<a href="" data-rel="back" class="ui-btn ui-carat-l ui-btn-icon-left ui-shadow ui-corner-all ui-btn-icon-notext">Back</a>  

        <h1>Options</h1>
    </div><!-- /header -->

    <div role="main" class="ui-content">
<a href="alertslist.html" data-ajax="false" class="ui-btn ui-icon-carat-r ui-btn-icon-right ui-state-disabled">Alerts</a>
<a href="filterslist.html" data-ajax="false" class="ui-btn ui-icon-carat-r ui-btn-icon-right ui-state-disabled">Filters</a>
<a href="#refopt" class="ui-btn ui-icon-carat-r ui-btn-icon-right" >Refresh Rate</a>

    </div><!-- /content -->

    <div data-role="footer">
        <h4></h4>
    </div><!-- /footer -->
</div><!-- /page -->

<!-- Start of second page -->
<div data-role="page" id="refopt">

    <div data-role="header">
<a href="" data-rel="back" class="ui-btn ui-carat-l ui-btn-icon-left ui-shadow ui-corner-all ui-btn-icon-notext">Back</a>  
        <h1>Refresh Rate</h1>
    </div><!-- /header -->

    <div role="main" class="ui-content">
            <fieldset data-role="controlgroup" data-iconpos="right">
                <legend>The frequency that the application refreshes the dispatched events. 
                    Increasing this may reduce data usage, but will slow down how quickly you are notified of a new event</legend>
                <input type="radio" name="refreshtime" id="10" value="10000" checked="checked" onclick="save_val('10000')">
                <label for="10">10 Seconds (Default)</label>
                <input type="radio" name="refreshtime" id="20" value="20000" onclick="save_val('20000')">
                <label for="20">20 Seconds</label>
                <input type="radio" name="refreshtime" id="30" value="30000" onclick="save_val('30000')">
                <label for="30">30 Seconds</label>
                <input type="radio" name="refreshtime" id="60" value="60000" onclick="save_val('60000')">
                <label for="60">1 Minute</label>
                <input type="radio" name="refreshtime" id="120" value="120000" onclick="save_val('120000')">
                <label for="120">2 Minutes</label>
                </fieldset>
</div><!-- /content -->

    <div data-role="footer">

        <h4></h4>
    </div><!-- /footer -->
</div>

<!-- /page -->
</body>
</html>

0 个答案:

没有答案