Javascript 剑道UI不向上滚动
我正在开发和应用程序使用Telerik使用科尔多瓦和剑道用户界面。 我遇到的问题是，如果我在一个div中向下滚动，然后使用一个简单的显示切换到div：当前滚动的div上没有显示，新div上有一个显示：block，我希望看到整个应用程序保持向下滚动，我没有向上滚动的选项，我只是得到一个空屏幕 下面是我正在使用的代码：Javascript 剑道UI不向上滚动,javascript,jquery,html,cordova,kendo-ui,Javascript,Jquery,Html,Cordova,Kendo Ui,我正在开发和应用程序使用Telerik使用科尔多瓦和剑道用户界面。 我遇到的问题是，如果我在一个div中向下滚动，然后使用一个简单的显示切换到div：当前滚动的div上没有显示，新div上有一个显示：block，我希望看到整个应用程序保持向下滚动，我没有向上滚动的选项，我只是得到一个空屏幕 下面是我正在使用的代码： <body onload="onDeviceReady();logint();"> <div id="tabstrip-home" data
<body onload="onDeviceReady();logint();">
<div id="tabstrip-home"
data-role="view"
data-title="Login"
data-model="app.loginService.viewModel">
<div id="startupForm" data-role="view" style="display:block;">
<img id="startup" class="startup" src="styles/images/startup.jpg"/>
<input id="closeStartButton" onclick="closeStart();" type="image" src="styles/images/vor.png" name="image" width="40" height="40" style="bottom:0;position:fixed;right:0;">
</div>
<div class="logo-image" id="top" name="top"></div>
<div id="home" data-role="scroller" style="display:none;">
<div id="homeOverview" style="background-color: rgba(255,255,255,0.5);margin-left: 5px;margin-right: 5px;color:black;box-shadow: 3px 3px 20px black;">
<h3 style="padding-top:5px;">Angemeldet als: <span id="user"></span></h3>
<div id="statsNr" style="display:none;">
<h3 >Zählwerke gesamt: <span id="zaehler"></span></h3>
<h3 style="padding-bottom:5px;">Zählwerke erfasst: <span id="zaehlererfasst"></span></h3>
</div>
</div>
<div id="auftragGeladenUndDa">
<div style="margin-left:10px;">
<button data-role="button" data-bind="click: showTermine" style="height: 50px;width: 30%; padding-top: 0.75em; text-align: center;">
Termine
</button>
<button data-role="button" data-bind="click: schhin" style="height: 50px;width: 30%; padding-top: 0.75em; text-align: center;">
Schlüsselliste
</button>
<button data-role="button" data-bind="click: showStats" style="height: 50px;width: 30%; padding-top: 0.75em; text-align: center;">
Statistik
</button>
<button data-role="button" onclick="test();" data-bind="click: showAbles" style="height: 50px;width: 61%; padding-top: 0.75em; text-align: center;">
Erfassen
</button>
<button id="homeErfass" data-bind="click: showUpload" data-role="button" style="height: 50px;width: 30%; padding-top: 0.75em; text-align: center;">
Ergebnisse übermitteln
</button>
</div>
</div>
<div id="auftragNichtDa">
<button id="auftrag" onclick="kAuftragLaden();" data-bind="click: geladen" data-role="button" style="width: 90%; margin: 1em; padding-top: 0.75em;padding-right: 1.5em;padding-bottom: 0.8125em;padding-left: 1.5em; text-align: center;">
Neuen Auftrag laden
</button>
</div>
</div>
<div id="hinweiseForm" style="display:none;">
<h3 id="row" style="color:black;">Hinweis und Schlüsselliste</h3>
<table id="hinweis" border="0" style="z-index: 1;background-color:white;margin-left: 10px;margin-right: 10px;margin-bottom:5%;">
<tr>
</tr>
</table>
</div>
<div id="terminForm" data-role="view" style="display:none;">
<h3 id="row" style="color:black;">Termine</h3>
<div style="background-color: rgba(255,255,255,0.5);margin-left: 5px;margin-right: 5px;color:black;box-shadow: 3px 3px 20px black;">
<p>Keine Termine vorhanden</p>
</div>
</div>
<div id="uploadForm" data-role="view" style="display:none;">
<h3 id="row" style="color:black;">Ergebnisse übermitteln</h3>
<div id="uploadEinheit" style="background-color: rgba(255,255,255,0.5);padding-top:5px;padding-bottom:3px;margin-bottom:3px;margin-left: 5px;margin-right: 5px;color:black;box-shadow: 3px 3px 20px black;">
<input id="theCheckbox" type="checkbox">
</div>
</div>
<div id="statsForm" style="display:none;" >
<div style="background-color: rgba(255,255,255,0.5);margin-left: 5px;margin-right: 5px;color:black;box-shadow: 3px 3px 20px black;">
<h3 id="row" style="padding-top:5px;">Statistik</h3>
<h3 >Zählwerke gesamt: <span id="zaehlerin"></span></h3>
<h3 style="padding-bottom:5px;">Zählwerke erfasst: <span id="zaehlererfasstin"></span></h3>
</div>
<div style="background-color: rgba(255,255,255,0.5);margin-left: 5px;margin-right: 5px;color:black;box-shadow: 3px 3px 20px black;padding-top: 10px;">
<ul data-role="listview" data-style="inset" >
<li><div style="color:black;">Ort:</div>
<label>
<select style="color:black;" onchange="onchangeOrt();" id="statOrt"></select>
</label>
</li>
</ul>
<ul data-role="listview" data-style="inset" >
<li>
<div style="color:black;">Strasse</div>
<label>
<select style="color:black;" onchange="onchangeStrasse();" id="statOrt"></select>
</label>
</li>
</ul>
</div>
<div id="savedStrasse"></div>
</div>
<div id="ablesForm" style="display:none;" >
<ul data-role="listview" data-style="inset">
<h3 id="row" style="color:black;margin-bottom: 0;margin-top: 0;">Orte</h3>
<li>
<input id="stift" type="image" src="styles/images/erfassen.png" name="image" width="40" height="40" style="">
<input type="image" src="styles/images/suchen.png" name="image" width="40" height="40" style="">
<input type="image" src="styles/images/foto.png" name="image" width="40" height="40" style="">
<input type="image" src="styles/images/karte.png" name="image" width="40" height="40" style="">
</li>
<li>
<select id="recog" onchange="changeFunc();" style="color:black;left: 0;width: 200px;"> </select>
<select id="2tab" onchange="changeAnz2();" style="margin-right:60px;color:black"><option value="1">K</option><option value="2">Z</option></select>
<select id="alleOffen" onchange="changeAnz2();" style="color:black;"><option value="1">Alle</option><option value="2">Offen</option></select>
</li>
</ul>
<div id="all1" style="font-size: 18pt;height:95%;background-color:white;margin-top: 0;margin-left:25px;margin-right:25px;box-shadow: 3px 3px 20px black;"></div>
<div id="all2" style="font-size: 18pt;height:95%;display:none;"></div>
<div id="all3" style="font-size: 18pt;height:95%;display:none;"></div>
<div id="all4" style="font-size: 18pt;height:95%;display:none;"></div>
</div>
<div id="erfassForm" style="display:none;" >
<div style="background-color: rgba(255,255,255,0.5);margin-left: 5px;margin-right: 5px;color:black;box-shadow: 3px 3px 20px black;padding-top: 1px;">
<h3 style="color:black;display:none;" id="erfassName"></h3>
<h3 style="color:black;" id="erfassNameAnz"></h3>
<h3 style="color:black;display:none;"id="zaehlerNr"></h3>
<h3 style="color:black;"id="adresse"></h3>
<h3 style="color:black;display:none;"id="erfassStrasse"></h3>
<h3 style="color:black;display:none;"id="erfassHausnr"></h3>
<h3 style="color:black;display:none;"id="zpunktID"></h3>
<h3 style="color:black;display:none;"id="zaehlerID"></h3>
<h3 style="color:black;display:none;" id="ablEin"></h3>
<h3 style="color:black;display:none;" id="gerNR"></h3>
<h3 style="color:black;display:none;" id="AbleserNR"></h3>
<h3 style="color:black;"id="standMin" ></h3>
<h3 style="color:black;"id="standMax" ></h3>
<h3 style="color:black;display:none;" id="plasib"></h3>
<h3 style="color:black;display:none;" id="rebuild"></h3>
<select id="alleOrte" style="color:black;width: 45%;"></select>
<select id="alleAbleser" style="color:black;width: 45%; margin-left:20px;"></select>
<h3 style="color:black;margin-bottom: 0;">Zustandsmeldung</h3>
<select id="alleFehler" style="color:black;"></select>
<h3 style="color:black;margin-bottom: 0;">Aktueller Zählerstand</h3>
<input id="stand" type="stand" style="margin-left: 10px;"/>
<button data-click="reset" onclick="erfassenZae();" data-role="button" style="width: 40%; margin: 1em; padding-top: 0.75em;padding-right: 1.5em;padding-bottom: 0.8125em;padding-left: 1.5em; text-align: center;">
Erfassen
</button>
</div>
<br><br><br><br><br><br>
<div class="result-area ch50">
<div class="results">
<img style="display:none;margin:5px auto; width:120px; height:120px;" id="smallImage"/>
</div>
<div class="separator"></div>
</div>
</div>
<div id="settings" style="display:none;" >
<div id="adminMS" style="color:black;display:none;">Kennwort
<input id="adminPass" style="text-align:right;width: 150px;color: black;"/>
</div>
<div id="server" style="color:black;">
<p>Sie müssen beim ersten Start einen Server einrichten. Bitte machen Sie dies jetzt!</p>
<p id="infofield"></p>
<p id="os"></p>
<p id="version">2.0.0.6</p>
<div style="display:inline">
<p>Serveradresse:</p>
<input type="text" id="eingabe" style="width: 80%; margin-left: 5px;"/><br>
<button onclick="serverSpeichern();" id="serverTres" data-role="button" style="width: 40%; margin: 1em; padding-top: 0.75em;padding-right: 1.5em;padding-bottom: 0.8125em;padding-left: 1.5em; text-align: center;">Speichern</button>
</div>
<p>Qualitätsstufe (in Prozent) <input type="text" id="qalID" style="width: 100px; margin-left: 5px;"/><br></p>
<button id="settingsCloseButton" onclick="closet();logint();qalSpeichern();" data-role="button" style="width: 40%; margin: 1em; padding-top: 0.75em;padding-right: 1.5em;padding-bottom: 0.8125em;padding-left: 1.5em; text-align: center;">Ok</button>
</div>
<button id="adminButton" onclick="showServer();" data-role="button" style="display:none;width: 40%; margin: 1em; padding-top: 0.75em;padding-right: 1.5em;padding-bottom: 0.8125em;padding-left: 1.5em; text-align: center;">Anmelden</button>
</div>
<form data-bind="events: { keyup: checkEnter }" id="logForm" style="background-color: white; padding-top: 1px;margin-left: 10px;margin-right: 10px;height:95%;box-shadow: 3px 3px black;">
<h3 data-bind="invisible: isLoggedIn" style="color:black;font-size:16pt;">Benutzeranmeldung</h3>
<ul data-role="listview" data-style="inset">
<li>
<div style="color:black;margin-left:5px;">Geräte gesamt:
<div style="width: 30%;border: 1px solid gray;height: 20px;display: inline-block;float: right;border-radius: 5px;background-color: white;"></div>
</div>
<label>
</label>
</li>
<li style="top:0;margin-left:5px;">
<div style="color:black;">Geräte abgelesen:
<div style="width: 30%;border: 1px solid gray;height: 20px;display: inline-block;float: right;border-radius: 5px;background-color: white;"></div>
</div>
<label>
</label>
</li>
<li><div style="color:black;margin-left:5px;height: 40px;">Ableser</div>
<label>
<select style="width: 30%;border: 1px solid gray;display: inline-block;float: right;border-radius: 5px;background-color: white;color:black;margin-right: 10px;" onchange="onchangeLogin();" id="Model" type="number" data-bind="value: username"> </select>
</label>
</li>
<li>
<div style="color:black;margin-left:5px;margin-top: 5px;">Kennwort</div>
<label>
<input id="passInput" onkeyup="disableButton();" onclick="cleart();" style="text-align:right;width: 30%;border: 1px solid gray;height: 20px;display: inline-block;float: right;border-radius: 5px;background-color: white;color:black;margin-right: 10px;" type="password" data-bind="value: password"/>
</label>
</li><br>
<li><button id="login" type="submit" data-role="button" data-bind="click: onLogin" value="Login" class="login-button" style="-webkit-border-radius: 5px;background-color: rgba(200,200,200,1.0);box-shadow: 3px 3px black;color:black;float:right;width:30%;">weiter</button></li>
</ul>
<!--<button onclick="settings();serverAnzeigen();" data-role="button" style="width: 40%; margin: 1em; padding-top: 0.75em;padding-right: 1.5em;padding-bottom: 0.8125em;padding-left: 1.5em; text-align: center;">Einstellungen</button>
--><br>
</form>
</div>
<input onclick="openStart();" type="image" src="styles/images/zurueck.png" style="display:none;"name="image" width="40" height="40">
<div data-role="layout" data-id="tabstrip-layout">
<div data-role="header">
<div data-role="navbar">
<span data-role="view-title"></span>
</div>
</div>
<div data-role="footer" >
<div id="footert" style="width: 100%;display:none;">
<input id="closeButton" onclick="showHome();" type="image" src="styles/images/zurueck.png" name="image" width="40" height="40" style="bottom:0;position:fixed;">
<input id="closeHome" onclick="logout();" type="image" src="styles/images/zurueck.png" name="image" width="40" height="40" style="bottom:0;position:fixed;">
<input id="uploadButton" onclick="uploadAll();" type="image" src="styles/images/uebermitteln.png" name="image" width="40" height="40" style="bottom:0;position:fixed;display:none;">
<!--<button id="closeButton" onclick="showHome();" data-click="reset" data-role="button" style="width: 40%; text-align: center;display:none;">Schließen</button>
<button id="erfassButton" data-click="reset" data-bind="click: showErfass" data-role="button" style="display:none; width: 40%; text-align: center;">Ablesen</button>
-->
<input id="settingsButton" onclick="settingsH();" type="image" src="styles/images/einstellungen.png" name="image" width="40" height="40" style="bottom:0;position:fixed;display:none;">
</div>
</div>
</div>
</body>
</html>
提前感谢我使用scrollTo方法滚动到视图顶部
app.application = new kendo.mobile.Application(document.body, {
layout: "tabstrip-layout"
});
// get the view scroller
var scroller = app.application.view().scroller;
/*
* scroller.scrollTop = The number of pixels that are hidden from view above the
* scrollable area.
*/
if (scroller.scrollTop) {
scroller.scrollTo(0, 0);
}
你有没有试过在每页显示中重置滚动条？是的，我试过了。我现在正试着把所有的东西分开放在自己的分区里
app.application = new kendo.mobile.Application(document.body, {
layout: "tabstrip-layout"
});
// get the view scroller
var scroller = app.application.view().scroller;
/*
* scroller.scrollTop = The number of pixels that are hidden from view above the
* scrollable area.
*/
if (scroller.scrollTop) {
scroller.scrollTo(0, 0);
}