JQuery不适用于WebView

时间:2011-07-19 17:18:49

标签: android jquery android-webview android-2.2-froyo

我尝试在资源/脚本和Internet上包含JQuery文件,但警报对话框没有显示。我得到了日志输出并使其成为output.html,它在Windows中工作(太奇怪了!)。 WebView有什么问题?

public void onCreate(final Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.main);

    webView = (WebView) findViewById(R.id.webView);
    final String s = "<html><head>" +
    "<link href=\"css/my.css\" type=\"text/css\" rel=\"stylesheet\" />" +
    "<script src=\"scripts/jquery-1.6.2.min.js\" rel=\"stylesheet\" type=\"text/javascript\"></script>" +
    "<script src=\"https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.js\" type=\"text/javascript\"></script>" +
    "<script>" +
    "$(document).ready(function(){ alert('hello'); });" +
    "</script>" +
    "</head><body><div>All I hear is raindrops." +
    "Falling on the rooftop. Oh baby tell me why you have to go. " +
    "Cause this pain I feel you won't go away. And today, " +
    "I'm officially missing you.</div></body></html>";
    webView.getSettings().setJavaScriptEnabled(true);
    Log.d("Something", s);
    webView.loadDataWithBaseURL("file:///android_asset/", s, "text/html", "utf-8", null);
}

这是添加扩展名“.html”后的日志输出。它适用于Firefox,但不适用于WebView。 :(

<html>
<head>
<link href="css/my.css" type="text/css" rel="stylesheet" />
<script src="scripts/jquery-1.6.2.min.js" rel="stylesheet" type="text/javascript"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.js" type="text/javascript"></script>
<script>$(document).ready(function(){ alert('hello'); });</script>
</head>
<body>
    <div>
    All I hear is raindrops.Falling on the rooftop. Oh baby tell me why you have to go. Cause this pain I feel you won't go away. And today, I'm officially missing you.
    </div>
</body>
</html>

6 个答案:

答案 0 :(得分:7)

webView.loadDataWithBaseURL("file:///android_asset/", s, "text/html", "utf-8", null);

改为

webView.loadDataWithBaseURL(getAssets(), s, "text/html", "utf-8", null);

要获取资产文件,您需要访问应用的资产路径。应用程序是Android上的用户,因此无法访问以“file://”目录开头的路径。

答案 1 :(得分:2)

您需要在assets / scripts文件夹中包含jquery.js文件才能生效。

脚本/ jQuery的1.6.2.min.js

这应该有效。

答案 2 :(得分:2)

setPluginsEnabled设置中{p> WebView true

答案 3 :(得分:2)

正如Android WebView doesn't load jQuery已经提到的那样:

您的scripts / jquery-1.6.2.min.js脚本位于何处?如果它位于您的资产目录中,那么您应该初始化webView,将其资产目录作为baseUrl:

webView.loadDataWithBaseURL("file:///android_asset/", data, "text/html", "UTF-8", null);

webView.loadUrl("file:///android_asset/file.html");

您可以尝试使用像

这样的简单函数创建一个简单的.js文件
function dummy(document) { document.write("Hooray it works"); }

并尝试访问html中的 dummy 函数,以测试是否包含.js文件。

答案 4 :(得分:2)

我猜,你的代码应该实现一些javascript函数,如提示和警报(系统弹出窗口)。 一个简单的指南..,

<强> 1。创建一个类Jscalls.java

public class Jscalls {

    Context mContext;
    Jscalls(Context c) {
        mContext = c;
    }

    /** Show a toast from the web page */
    public void alert(String toast) {
        Toast.makeText(mContext, toast, Toast.LENGTH_SHORT).show();
    }    
}

<强> 2。在您的计划中添加,webView.addJavascriptInterface(new Jscalls(this), "Android");

第3。在html网页而不是alert("hello") 中,使用Android.alert("hello")

希望它有效:)

答案 5 :(得分:1)

您应该提供加载javascript和css的完整路径,例如

<link href="http://yourdomain.com/css/my.css" type="text/css" rel="stylesheet" />