web标准常见问题--FF下如何使连续长字段自动换行

最新推荐文章于 2024-08-04 15:26:20 发布

转载最新推荐文章于 2024-08-04 15:26:20 发布 · 115 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/guopei/archive/2009/08/04/1538549.html

文章标签：

#xhtml #javascript #ViewUI

通常情况下我们可以添加(word-wrap:break-word; display:none;)来实现。在IE浏览器中没有问题，但是firefox不支持换行，我们可以通过js达到换行的效果

function tobreakword(intLen)

{

//获取id=ff的容器

var obj = document.getElementById("ff");

//获取id=ff容器内容的html

var strContent = obj.innerHTML;

//定义一个空字符串

var strTemp = "";

//使用while循环给strContent添加换行

while(strContent.length > intLen)

{

//截取0-intLen之间的字符串之后添加换行

strTemp += strContent.substr(0,intLen)+" ";

strContent = strContent.substr(intLen,strContent.length);

}

strTemp += " " + strContent;

//把最终的strTemp添加到obj中

obj.innerHTML=strTemp;

}

//判断是否是firfox浏览器

if(document.getElementById && !document.all) tobreakword(56);

</script>

不过个这js不是很灵活需要根据容器的宽度手动更改intLen的值。

完整代码：

Code
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="zh" lang="zh">
<head profile="http://www.w3.org/2000/08/w3c-synd/#">
<meta http-equiv="content-language" content="zh-cn" />
<meta http-equiv="content-type" content="text/html;charset=utf-8" />
<title>FF下如何使连续长字段自动换行</title>
<style type="text/css">
*{ margin:0; padding:15px;}
#ff{ width:450px; height:350px; line-height:25px; overflow:hidden; word-wrap:break-word; border:1px solid #ddd; padding:5px;}
</style>

</head>
<body>
    <div id="ff">aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa </div>
    <script language="javascript">
    function tobreakword(intLen){
        //获取id=ff的容器
        var obj = document.getElementById("ff");
        //获取id=ff容器内容的html
        var strContent = obj.innerHTML;
        //定义一个空字符串
        var strTemp = "";
        //使用while循环给strContent添加换行
        while(strContent.length > intLen){
            //截取0-intLen之间的字符串之后添加换行
            strTemp += strContent.substr(0,intLen)+" ";
            strContent = strContent.substr(intLen,strContent.length);
            }
        strTemp += " " + strContent;
        //把最终的strTemp添加到obj中
        obj.innerHTML=strTemp;
        }
        //判断是否是firfox浏览器
        if(document.getElementById && !document.all)  tobreakword(56);
    </script>

</body>
</html>

不过有个问题不明白，当我把js添加到head中时，js就不起作用了，哪位高手指教一下。- -

转载于:https://www.cnblogs.com/guopei/archive/2009/08/04/1538549.html