JQuery 在 WebView 上不起作用
Posted
技术标签:
【中文标题】JQuery 在 WebView 上不起作用【英文标题】：JQuery doesn't work on WebView 【发布时间】：2011-10-08 17:43:33 【问题描述】：我尝试在资产/脚本和 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>
【问题讨论】：
你解决了吗？我现在正面临这个问题。我能做些什么？ :( 【参考方案1】：webView.loadDataWithBaseURL("file:///android_asset/", s, "text/html", "utf-8", null);
改成
webView.loadDataWithBaseURL(getAssets(), s, "text/html", "utf-8", null);
要获取资产文件，您需要访问应用程序的资产路径。应用是Android上的用户，因此无法访问以“file://”目录开头的路径。
【讨论】：
错误 :)，loadDataWithBaseUrl() 中的参数 getAssets 错误；【参考方案2】：您需要在 assets/scripts 文件夹中拥有 jquery.js 文件才能正常工作。
脚本/jquery-1.6.2.min.js
应该可以的。
【讨论】：
我只是用完全相同的代码检查它，它可以工作。你确定你用正确的文件名保存了吗？或者如果您想从网上获取它，请尝试添加 INTERNET 权限，这也可以。 @Emerald214 对我也不起作用，我注释掉了 CSS 行，并且在 3.1 设备上使用 Android 3.0 在我的根资产文件夹中有一个 jquery.min.js 文件【参考方案3】：正如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】：将WebView 设置中的setPluginsEnabled 设置为true。
【讨论】：
你能提供一些示例代码吗？我在任何地方都看不到与 WebView 相关的“setPluginsEnabled”函数【参考方案5】：我猜，一些 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")
希望它有效:)
【讨论】：
是的，当然可以。虽然我们似乎面临一个完全不同的问题。【参考方案6】：例如，您应该提供加载 javascript 和 css 的完整路径
<link href="http://yourdomain.com/css/my.css" type="text/css" rel="stylesheet" />
【讨论】：
我已经这样做了，问题出在其他地方。感谢您的意见。以上是关于JQuery 在 WebView 上不起作用的主要内容，如果未能解决你的问题，请参考以下文章
React Native WebView 在某些设备上不起作用
iFrame allowFullScreen 属性在 Android WebView 上不起作用
Expo / React Native WebView，动画中的onPress事件在Android上不起作用
Android webview html5 视频自动播放在 android 4.0.3 上不起作用