XHTML 1.1:移动<object>的onload属性

时间:2015-08-31 20:09:22

标签: javascript xhtml

我工作场所的网站环境:

  • Windows Server 2012,IIS 8
  • Web.config添加默认文件index.html
  • XHTML 1.1严格的html文件,一个非常简单的网站

主文件是index.html,javascript用于更改文件中使用的对象元素的数据属性。然后在Javascript中克隆该对象以使其在data属性更改时呈现自身(是的,hackish,但工作正常)然后通过onload属性调用javascript以将该对象元素的大小调整为与其内容相同的高度

这类似于iframe元素的旧HTML用法,但是XHTML 1.1严格符合对象。不幸的是,在object元素中使用属性onload会破坏XHTML 1.1验证。

所以我想通过为onload或者object元素的onready状态添加一个监听器来将该功能移到我的javascript文件中。我可以让onload监听器在文档或窗口或课程上工作,但让它在object元素上工作是不行的。

我唯一要排除故障的想法是在复制对象元素时再次添加侦听器。例如,当我复制该元素时,该侦听器是否丢失了?

请不要使用jquery解决方案(避免使用这个独立站点的外部库)。

提前致谢!

html文件部分......

<object id="mainContent" type="text/html" data="home.html"
standby="Loading..." onload="resizeObject(this);"></object>

javascript来克隆和调整大小......

function navigateTo(page)
{
    var objectContent = document.getElementById('mainContent');
    objectContent.setAttribute('data', page);
    var menus = document.getElementsByClassName('dropdownMenu');
    var i;
    for (i = 0; i < menus.length; i++)
    {
        menus[i].setAttribute('class', 'dropdownMenu hidden');
    }
    //clone and replace object element in order for it to update the DOM
    var temp = objectContent.cloneNode(true);
    objectContent.parentNode.replaceChild(temp, objectContent);
}
function resizeObject(obj)
{
    var h = obj.contentWindow.document.body.scrollHeight;
    if (h < 500)
    {
        h = 650;
    }
    h = h + 100;
    obj.style.height = h + 'px';
}

听众示例不起作用......

var Content = document.getElementById('contentMain');
Content.addEventListener("click", function()
{
    resizeObject(Content);
});

0 个答案:

没有答案