[英]android webview javascript in page not work
我意識到我在android webview頁面中的javascript無法正常工作。 但是,我已經在活動文件的onCreate()函數中啟用了javascript,如下所示。 請幫忙。 非常感謝。
活動文件:
@SuppressLint("SetJavaScriptEnabled")
public class MessageActivity extends Activity {
WebView mWebView;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_message);
new LongRunningGetIO().execute();
mWebView = (WebView) findViewById(R.id.webview);
mWebView.setWebChromeClient(new WebChromeClient());
mWebView.setVerticalScrollBarEnabled(false);
mWebView.getSettings().setJavaScriptEnabled(true);
mWebView.getSettings().setDomStorageEnabled(true);
mWebView.loadUrl("file:///android_asset/index.html");
}
}
主頁(在此頁面中,滑動以獲取面板的js不起作用)
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>LoadPageTest</title>
<link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Open+Sans:300,400,700">
<link rel="stylesheet" href="./css/customizedstyle.css">
<link rel="stylesheet" href="./css/themes/default/jquery.mobile-1.4.3.min.css">
<link rel="stylesheet" href="./css/jqm-demos.css">
<script src="./js/jquery.js"></script>
<script scr="./js/customizedjs.js"></script>
<script src="./js/jquery.mobile-1.4.3.min.js"></script>
<script>
$( document ).on( "pagecreate", "#demo-page", function() {
$( document ).on( "swipeleft swiperight", "#demo-page", function( e ) {
if ( $( ".ui-page-active" ).jqmData( "panel" ) !== "open" ) {
if ( e.type === "swipeleft" ) {
$( "#right-panel" ).panel( "open" );
}
}
});
});
</script>
<style type="text/css">
body {
overflow:hidden;
}
</style>
</head>
<body style= "overflow:hidden" scrolling="no">
<style type="text/css">
body {
overflow:hidden;
}
</style>
<div data-role="page" id="main-page" style= "overflow:hidden" scrolling="no">
<div role="main" class="ui-content" id ="maindiv" style= "overflow: auto">
Will load diff pages here.
</div><!-- /content -->
<div data-role="panel" id="left-panel" data-theme="b">
<ul data-role="listview" data-icon="false" id="menu">
<li>
<a href="#" id = "btnA" data-rel="close">Go Page A <img src="./images/icona.png" class="ui-li-thumb"/>
</li>
<li>
<a href="#" id = "btnB" data-rel="close">Go Page B <img src="./images/iconb.png" class="ui-li-thumb"/>
</li>
</ul>
</div><!-- /panel -->
<script type="text/javascript">
$("#btnA").on("click", function(){
$("#maindiv").empty();
$("#maindiv").load("pageA.html");
});
$("#btnB").on("click", function(){
$("#maindiv").empty();
$("#maindiv").load("pageB.html");
});
</script>
</div><!-- /page -->
</body>
</html>
已加載的頁面(在此頁面中,無法在頁面顯示之前加載列表項“ abc”的js代碼不起作用)
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Page should be loaded</title>
<link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Open+Sans:300,400,700">
<link rel="stylesheet" href="./css/customizedstyle.css">
<link rel="stylesheet" href="./css/themes/default/jquery.mobile-1.4.3.min.css">
<link rel="stylesheet" href="./css/jqm-demos.css">
<script src="./js/jquery.js"></script>
<script scr="./js/customizedjs.js"></script>
<script src="./js/jquery.mobile-1.4.3.min.js"></script>
<script>
$(document).on('pagebeforeshow', function () {
$('#postlist').append('<li> abc </li>');
$('#postlist').listview('refresh');
});
</script>
</head>
<body >
<div data-role="page" id="posthome">
<div data-role = "content">
<ul data-role='listview' id = "postlist">
</ul>
</div>
</div>
</body>
</html>
我的項目結構是
<script src="./js/jquery.js"></script>
<script scr="./js/customizedjs.js"></
<script src="./js/jquery.mobile-1.4.3.min.js"></script>
您在JavaScript代碼(實際上是jQuery
中引用這些文件。 您確定資產文件夾中有這些文件嗎? 否則,腳本將無提示崩潰,並且您將不會知道。
這就是您的結構的樣子:
android_asset
|_ index.html
|_ js
|_ <your jquery files>
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.