我正在尝试添加Disqus到我的Ionic/Cordova应用程序。我已经成功地使用iframe将Disqus小部件显示在模板中,但是如果我单击Disqus小部件登录到Disqus以添加注释,或者查看Disqus社区选项卡,则应用程序将进入一个不可滚动的Disqus页面,该页面将填充整个屏幕,无法返回应用程序。
有没有办法让页面滚动起来,比屏幕还小,这样用户就可以重新进入应用程序。
静态服务器上的Disqus代码服务器是:
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
</head>
<body>
<div id="disqus_thread"></div>
<script type="text/javascript">
var params;
var disqus_url;
var disqus_title;
var disqus_shortname;
var disqus_identifier;
window.onload = function () {
var match,
pattern = /\+/g,
search = /([^&=]+)=?([^&]*)/g,
decode = function (s) { return decodeURIComponent(s.replace(pattern, " ")); },
query = window.location.search.substring(1);
params = {};
while (match = search.exec(query))
params[decode(match[1])] = decode(match[2]);
if (params["shortname"] === undefined || params["url"] === undefined || params["title"] === undefined) {
alert("Required arguments missing");
}
else {
loadComments(params["shortname"], params["url"], params["title"], params["identifier"]);
}
};
function loadComments(shortname, url, title, identifier) {
disqus_url = url;
disqus_title = title;
disqus_shortname = shortname;
if (identifier !== undefined)
disqus_identifier = identifier;
else
disqus_identifier = "";
(function() {
var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = false;
dsq.src = 'http://' + disqus_shortname + '.disqus.com/embed.js';
(document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
})();
}
</script>
<noscript>Please enable JavaScript to view the <a href="http://disqus.com/?ref_noscript">comments powered by Disqus.</a></noscript>
<a href="http://disqus.com" class="dsq-brlink">blog comments powered by <span class="logo-disqus">Disqus</span></a>
</body>
</html>
在我的应用程序的控制器里,我有:
var disqus_title = "TEST";
var disqus_identifier = '/movie/' + 0;
var disqus_url = 'http://example.com/movie/' + 0;
var url = "http://example.com/disqus.html?";
$scope.disqusurl = url + "shortname=example&url=" + encodeURIComponent(disqus_url) +
"&title=" + encodeURIComponent(disqus_title) + "&identifier=" + encodeURIComponent(disqus_identifier);
$scope.disqusurl = $sce.trustAsResourceUrl($scope.disqusurl);
模板文件的相关部分如下所示:
<ion-content>
...
<iframe style="max-height: 40%;" src="{{disqusurl}}"></iframe>
...
</ion-content>
编辑问题似乎是Disqus小部件中的网页链接是在应用程序中启动的。如果可以让链接在外部浏览器中打开,那么所有的链接都可以正常工作,但我不知道如何使HTML代码以这种方式工作。
发布于 2016-01-14 20:34:56
以下是我要尝试的:
1)尝试使用!重要的选择器来调用disqus的css。
2)尝试使用ajax加载内容
3)搜索和阅读这样的文章:https://help.disqus.com/customer/portal/articles/472096-using-disqus-in-mobile-apps
4)对你网站上有争议的页面设置一个iframe,并使iframe小于页面高度。
https://stackoverflow.com/questions/34798894
复制相似问题