HTC有难度

我发现如果将这个在HTC中的针如果放在测试页面中时,使用oblog_Composition.document.body.innerHTML ="<B>Mouse out to change back.</B>";可以给针赋值.比如下面的测试页面:
<HTML xmlns:IE>
<?IMPORT namespace=IE implementation="x.htc" >
<BODY bgcolor="white" onload="oblog_Composition.document.body.innerHTML='<B>Mouse out to change back.</B>';">

<table style="width=100%" border="1">
<tr>
          <td height="500" id=PostiFrame>
          <iframe class="oblog_Composition" ID="oblog_Composition" MARGINHEIGHT="5" MARGINWIDTH="5" width="100%" height="100%" ><b>hello world</b>
          </iframe>
          </td>
</tr>
</table>
<body>
</HTML>
可见这时一个关于在HTC中放置iframe出现的一个问题,即iframe的位置.照这样思路,我想是不是在测试页面中获得HTC中的针,就可以给它赋innerHTML,于是我修改了如下的HTC及页面,HTC如下:
<public:component tagname="input2">
<public:defaults viewLinkContent=true contentEditable=false />
<public:ATTACH EVENT="oncontentready" ONEVENT="fnInitIframe()" />
<PUBLIC:METHOD NAME="fngetIframe" />
</public:component>
<body>
<table style="width=100%" border="1">
<tr>
          <td height="500" id=PostiFrame>
          <iframe class="oblog_Composition" ID="oblog_Composition" MARGINHEIGHT="5" MARGINWIDTH="5" width="100%" height="100%" ><b>hello world</b>
          </iframe>
          </td>
</tr>
</table>
</body>
<Script language="javascript">function fngetIframe(){
return document.all.oblog_Composition;
}
function fnInitIframe()
{
initx();
}
function initx(){
alert("111111111111111"+oblog_Composition.innerHTML);
}
</Script>
测试页面如下:
<HTML xmlns:IE>
<?IMPORT namespace=IE implementation="x.htc" >
<BODY bgcolor="white" onload="xx.fngetIframe().document.body.innerHTML='<B>Mouse out to change back.</B>';alert(xx.fngetIframe().document.body.innerHTML)">
<IE:input2 id=xx border=0 mdisabled=true></IE:input2><br>
<body>
</HTML>
结果修改了整个测试页面的innerHTML??????????????????????

解决方案 »

免费领取超大流量手机卡，每月29元包185G流量+100分钟通话, 中国电信官方发货

你要分清 htc host 出来的是一个独立的 document, 和调用者元素的 document 是不一样的。所以如果你要在 htc 里面写一些 html, 然后复制到 element 所在的窗体文档里的话，需要一个复制元素的过程才行。具体比较烦琐就不写了。
谢谢inelm,能否讲一下这个复制的过程吧,你可以举一个最简单的例子,比如复制一个按钮.我看关于HTC的一些贴子经常出现在HTC中写入document这样的写法,这种写法一般何时使用?
就是把你在 htc 的文档里创建的那些物件，通过 element.document.insertAdjacentHTML 或者类似的方法附加到元素所在的文档中。
前几天我做了一个模拟的屏幕键盘 htc 你可以参考一下：keyboard.htc
--------------------------------------------
<public:component>
<public:attach event="onclick" onevent="handleClick()" />
<body>
<div id="divKeyboard" style="display:none; position: absolute; z-index: 99999;">
<table border="0" cellspacing="2" id="tblKeyboard">
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
<td>4</td>
<td>5</td>
<td>6</td>
<td>7</td>
<td>8</td>
<td>9</td>
<td>0</td>
</tr>
<tr>
<td>Q</td>
<td>W</td>
<td>E</td>
<td>R</td>
<td>T</td>
<td>Y</td>
<td>U</td>
<td>I</td>
<td>O</td>
<td>P</td>
</tr>
<tr>
<td>A</td>
<td>S</td>
<td>D</td>
<td>F</td>
<td>G</td>
<td>H</td>
<td>J</td>
<td>K</td>
<td>L</td>
<td></td>
</tr>
<tr>
<td>Z</td>
<td>X</td>
<td>C</td>
<td>V</td>
<td>B</td>
<td>N</td>
<td>M</td>
<td>退格</td>
<td>清空</td>
<td>确定</td>
</tr>
</table>
</div>
</body><script>
var kb = divKeyboard;
var tbl = tblKeyboard;
kb.onselectstart = function() {
return false;
}
kb.style.cursor = 'hand';tbl.style.backgroundColor = '#009900';
tbl.style.fontFamily = 'Verdana';
tbl.style.fontWeight = 'bold';
tbl.style.fontSize = '16px';
tbl.style.color = '#CCCCFF';for (var i=0; i<tbl.rows.length; i++) {
for (var j=0; j<tbl.rows[i].cells.length;j++) {
var td = tbl.rows[i].cells[j];
td.style.width = '50px';
td.style.height = '50px';
td.style.backgroundColor = 'green';
td.style.textAlign = 'center';
td.attachEvent("onmouseover", function() { event.srcElement.runtimeStyle.backgroundColor = '#33CC33'; });
td.attachEvent("onmouseout", function() { event.srcElement.runtimeStyle.backgroundColor = ''; });
}
}element.document.body.insertAdjacentElement("afterbegin", kb);var showed = false;function show() {
if (showed) return;
showed = true;
element.document.attachEvent("onmousedown", document_onmousedown);
kb.style.display = '';
/* v1.00
kb.style.left = element.offsetLeft;
kb.style.top = element.offsetTop + element.offsetHeight;
*/ /* v1.01
var kbStyle = kb.style;
var t = element.offsetTop;
var h = element.clientHeight;
var l = element.offsetLeft;
var p = element; while (p = p.offsetParent) {
t += p.offsetTop;
l += p.offsetLeft;
}
kbStyle.top = t + h + 6;
kbStyle.left = l;
*/ // v1.02
var pos = calcPos(kb, element);
pos.top += element.offsetHeight;
adjustMirror(kb, element, pos); with (kb.runtimeStyle) {
left = pos.left;
top = pos.top;
}
}function hide() {
if (!showed) return;
showed = false;
kb.style.display = 'none';
element.document.detachEvent("onmousedown", document_onmousedown);
}function document_onmousedown() {
var src = event.srcElement;
if (element.contains(src)) return;
if (kb.contains(src)) return;
hide();
}function handleClick() {
if (element.tagName != 'INPUT') return;
show();
}tbl.onclick = function handleBoardClick() {
var e = event.srcElement;
if (e.tagName != 'TD') return;
var c = e.innerText; switch (c) { case '':
break;
case '退格':
element.value = element.value.slice(0, -1);
break;
case '清空':
element.value = '';
break;
case '确定':
hide();
break;
default:
element.value += c;
}
}///////////////////////////////////////////////////////
//
// 定位函数部分  by Lostinet.
//
///////////////////////////////////////////////////////// scroll pos
function getScrollPos(e) {
var b = e.document.body;
if (e == b)
return {left: 0, top: 0};
with (e.getBoundingClientRect()) {
return {left: b.scrollLeft + left, top: b.scrollTop + top};
}
}
// client pos
function getClientPos(e) {
var b = e.document.body;
if (e == b)
return {left: -b.scrollLeft, top: -b.scrollTop };
with (e.getBoundingClientRect()) {
return {left: left - b.clientLeft, top: top - b.clientTop};
}
}
// get absolute or relative parent
function getStandParent(e) {
for (var p = e.parentElement; p != null; p = p.parentElement) {
var sp = p.currentStyle.position;
if (sp == 'absolute' || sp == 'relative')
return p;
}
return e.document.body;
}
// 计算 floate 相对于 e 的位置
function calcPos(floate, e) {
var ePos = getScrollPos(e);
var s = getStandParent(floate);
var sPos = getScrollPos(s); return {
left: ePos.left - sPos.left - s.clientLeft,
top: ePos.top - sPos.top - s.clientTop
};
}
//get the best position to put the floate
function adjustMirror(floate,e,pos)
{
//c:Client,f:floate,e:e,p:floate's StandParent,m:Mirror
var clientW = e.document.body.clientWidth;
var clientH = e.document.body.clientHeight;
var fW = floate.offsetWidth;
var fH = floate.offsetHeight;
var eW = e.offsetWidth;
var eH = e.offsetHeight; var eClientPos = getClientPos(e);
var eMirrorPos = {
left: eClientPos.left + eW / 2,
top: eClientPos.top + eH / 2
};
var pClientPos = getClientPos(getStandParent(floate));
var fClientPos = getClientPos(floate);
var fMirrorPos = {
left: pClientPos.left + pos.left + fW / 2,
top: pClientPos.top + pos.top + fH / 2
}; // left <--> right
if ((fMirrorPos.left < eMirrorPos.left) ? // 层的中心点在元素中心点左边
((fMirrorPos.left - fW / 2 < 0) // 层左侧会超出
&& ((eMirrorPos.left * 2 - fMirrorPos.left) + fW / 2 <= clientW))
: ((fMirrorPos.left + fW / 2 > clientW) && (( eMirrorPos.left * 2 - fMirrorPos.left) - fW / 2 >= 0)))
{
fMirrorPos.left = eMirrorPos.left * 2 - fMirrorPos.left;
} // top <--> bottom
if ((fMirrorPos.top < eMirrorPos.top) ?
((fMirrorPos.top - fH / 2 < 0) && ((eMirrorPos.top * 2 - fMirrorPos.top) + fH / 2 <= clientH))
: ((fMirrorPos.top + fH / 2 > clientH) && (( eMirrorPos.top * 2 - fMirrorPos.top) - fH / 2 >= 0)))
{
fMirrorPos.top = eMirrorPos.top * 2 - fMirrorPos.top;
} pos.left = fMirrorPos.left - pClientPos.left - fW / 2;
pos.top = fMirrorPos.top - pClientPos.top - fH / 2;
}
//////////////////////////////////////////////////////////////////
//
//    定位函数结束
//
//////////////////////////////////////////////////////////////////
</script>
</public:component>调用语句：<input style="behavior:url(keyboard.htc);">即可。
csdn 发贴现在有问题，贴出来原来排的好好的缩进都消失了。 sorry.本来我写的不是这样的。
http://search.csdn.net/Expert/topic/2134/2134827.xml?temp=8.819216E-02
这个东东应该符合要求吧.
谢谢intelm,我已经放弃使用HTC中包装那个iframe,不过你会试试你的思路!再次衷心的表示感谢.
不客气，我的 js 没有什么研究，属于初学者。这个小程序完全仿照 Lostinet 的日历控件写的。
如果你要提高 js 建议多向他以及楼上的 yonghengdizhen 学习。http://dev.csdn.net/user/lostinet
http://www.lostinet.com
http://www.lostinet.com/files
http://blog.joycode.com/lostinet