标签:html javascript ajax extjs sencha-touch-2
我在Sencha-Touch中使用htmlPanel.js,在论坛here中讨论过,以显示本地html内容.我可以使用普通的html标签加载html内容,但不能加载javascript.
下面是我使用的htmlPanel.js:
Ext.define('HTMLPanel', {
extend: 'Ext.Panel',
// We are using Ext.Ajax, so we should require it
requires: ['Ext.Ajax'],
config: {
listeners: {
activate: 'onActivate'
},
// Create a new configuration called `url` so we can specify the URL
url: null
},
onActivate: function(me, container) {
Ext.Ajax.request({
// we should use the getter for our new `url` config
url: 'htmlTest.html',//this.getUrl(),
method: "GET",
success: function(response, request) {
// We should use the setter for the HTML config for this
//Ext.Msg.alert('Alert', 'Success!!!', Ext.emptyFn);
me.setHtml(response.responseText);
},
failure: function(response, request) {
//Ext.Msg.alert('Alert', 'Failure!!!', Ext.emptyFn);
me.setHtml("failed -- response: " + response.responseText);
}
});
}
});
下面是我的htmlTest.html:
<!DOCTYPE html>
<html>
<body>
<canvas id="myCanvas">Your browser does not support the HTML5 canvas tag.</canvas>
<script type="text/javascript" charset="utf-8">
var c=document.getElementById('myCanvas');
var ctx=c.getContext('2d');
ctx.fillStyle='#FF0000';
ctx.fillRect(0,0,640,1280);
</script>
<h1>This is some text in a paragraph.</h1>
</body>
</html>
以下是我的index.js:
Ext.application({
name: 'SampleLoad',
launch: function () {
//loadURL('htmlTest.html');
Ext.Viewport.add({
url: 'htmlTest.html',
xclass: "HTMLPanel",
});
// Add the new HTMLPanel into the viewport so it is visible
Ext.Viewport.add(HTMLPanel);
}
});
我能够看到文本“有些文本在这里.”,但不是我尝试使用javascript创建的画布.
是否有需要指定的配置?还是其他原因?
谢谢.
解决方法:
问题是HTML被植入DOM中,但脚本不会被执行.这是分配给innerHtml的情况,也可能是setHtml()的情况.
您可以通过在拼接HTML后立即显式执行呈现元素中的脚本来解决此问题.您的htmlPanel.js将如下所示:
...
// We should use the setter for the HTML config for this
//Ext.Msg.alert('Alert', 'Success!!!', Ext.emptyFn);
me.setHtml(response.responseText);
var scriptArray = me.renderElement.dom.getElementsByTagName("script");
for(var i=0;i<scriptArray.length;i++) {
eval(scriptArray[i].text);
}
},
...
标签:html,javascript,ajax,extjs,sencha-touch-2 来源: https://codeday.me/bug/20190901/1785609.html
本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享; 2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关; 3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关; 4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除; 5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。