Question

IE10似乎忽略了在body onload事件期间进行的字体样式更改如何影响文本的宽度。在这个测试用例中，它最终将文本裁剪为短。有谁知道为什么，或者这是一个错误？谢谢！

<!DOCTYPE html>

<html lang="en-us">
<head>
<script type='text/javascript'>

function SetFontFamily(FontFamily) {
    var oForm = document.forms[0];
    for (var i = 0; i < oForm.elements.length; i++) {
        elm = oForm.elements[i];
        if (elm.type != 'checkbox' && elm.type != 'hidden') {
            var bold = "";
            if (FontFamily.indexOf('-Bold') >= 0)
                bold = "bold";

            var italic = "";
            if (FontFamily.indexOf('Italic') >= 0 || FontFamily.indexOf('Oblique') >= 0)
                italic = "italic";

            var face = "";
            if (FontFamily.indexOf('Times') >= 0)
                face = "times,serif";
            else if (FontFamily.indexOf('Helvetica') >= 0)
                face = "arial,sans-serif";
            else if (FontFamily.indexOf('Courier') >= 0)
                face = "courier,cursive";

            //elm.style.font = italic & bold & face
            elm.style.fontFamily = face;
            elm.style.fontWeight = bold;
            elm.style.fontStyle = italic;

        }
        //elm.value = elm.value;
    }
    document.getElementById('hidFontFace').value = FontFamily;
}

function SetFontSize(FontSize) {
    var oForm = document.forms[0];
    for (var i = 0; i < oForm.elements.length; i++) {
        elm = oForm.elements[i];
        if (elm.type != 'checkbox' && elm.type != 'hidden') {

            if (FontSize != 0) {
                elm.style.fontSize = (FontSize * 2) + "px";
            }
        }
    }
    document.getElementById('hidFontSize').value = FontSize;
}

function SetFontControls() {
    SetFontSize(document.getElementById('hidFontSize').value);
    SetFontFamily(document.getElementById('hidFontFace').value);
}

</script>
<title>

</title>
</head>
<body onload="SetFontControls();">
    <form method="post" id="Form1">
        <input type="hidden" name="hidFontSize" id="hidFontSize" value="9" />
        <input type="hidden" name="hidFontFace" id="hidFontFace" value="Courier-Bold" />
        <input name="txtIEtest" 
            type="text" 
            value="Why is IE10 taunting me?" 
            maxlength="120" 
            id="txtIEtest" 
            style="width:531px;height:27px;" />
    </form>
</body>
</html>

这是我在IE10中得到的： enter image description here

设置元素字体样式时IE10正文加载问题

0 个答案: