例如这段代码，不过不能实现分行显示，求大神改进
<html>
<head>
<title>逐字显示文字</title>
<script language="javascript">
<!--
text = "特顿发是树上是是";
i = 0;
function type(){
str = text.substr(0,i);
txt.innerHTML = str + "_";
i++;
if (i>text.length)i=0;
setTimeout("type()",300);
}
//-->
</script>
</head>
<body onLoad="type()">
<div id="txt"></div>
</body>
</html>
<html>
<head>
<title>逐字显示文字</title>
<script language="javascript">
<!--
text = "特顿发是树上是是";
i = 0;
function type(){
str = text.substr(0,i);
txt.innerHTML = str + "_";
i++;
if (i>text.length)i=0;
setTimeout("type()",300);
}
//-->
</script>
</head>
<body onLoad="type()">
<div id="txt"></div>
</body>
</html>
解决方案 »
- jQuery加载问题
- 求：div宽度固定，里面的文字内容比div长，当鼠标移上去时滚动显示后面的内容
- 兼容性问题--和刷新有关
- JS中怎么会出现这种情况?? 现场求解
- 大文本中的String.replace()操作奇慢无比！有好的优化方法吗？高手帮帮忙吧
- js文件中函数访问不到
- 关于iframe的src是servlet地址，在动态生成后，父页怎么获取iframe内元素？
- 达人看看这代码哪里错了，效果是input!=null时checked，帮忙改一下！谢谢
- 请各位高手帮忙呀！！一个另我头痛的问题！
- windows 98 下的打印分页
- 关于extjs4加不同TAB页加载不同store的问题 [灌水免进]
- 自已写的JS表单验证插件
<head>
<title>逐字显示文字</title>
<script language="javascript">
<!--
text = "特顿发是树上是是";
function type(i){
str = text.substr(0,i);
txt.innerHTML = str + "_";
if (txt.innerText.length % 10 == 0) { // 如果一行满10个字符，换行显示
txt.innerHTML += "<br />";
}
i++;
if (i>text.length)i=0;
setTimeout("type(" + i + ")",300);
}
//-->
</script>
</head>
<body onLoad="type(0)">
<div id="txt"></div>
</body>
</html>
<head>
<title>逐字显示文字</title>
<script language="javascript">
<!--
text = "特顿发是树上是是";
function type(i) {
str = text.substr(0, i);
document.getElementById("txt").innerHTML = str + "_";
if (document.getElementById("txt").innerHTML.length % 10 == 0) { // 如果一行满10个字符，换行显示
document.getElementById("txt").innerHTML += "<br />";
}
i++;
if (i > text.length) i = 0;
setTimeout("type(" + i + ")", 300);
}
//-->
</script>
</head>
<body onLoad="type(0)">
<div id="txt"></div>
</body>
</html>
试了一下innerHTML加不了换行,\r\n跟<br/>都不行
<head>
<title>逐字显示文字</title>
<script language="javascript">
<!--
var text = "1234567890";
var textLen = text.length;
var lineNum = 10; //定义每行显示多少个字
var num = 0;
var _ = document.createTextNode('_');
function type(i) {
str = text.substr(i, 1);
var txt = document.getElementById('txt');
txt.appendChild(document.createTextNode(str));
txt.appendChild(_);
if (num > 0 && num % lineNum == 0) { txt.appendChild(document.createElement('br')); document.title=num+"|"}
num++;
i++; if (i > textLen) i = 0;
setTimeout(function () { type(i)}, 300);
}
//-->
</script>
</head>
<body onLoad="type(0)">
<div id="txt"></div>
</body>
</html>
<head>
<title>javascript文字逐字逐行显示效果</title>
<script>
var text = "12345678901234567890123456789012345678901234567890";
var textLen = text.length;
var lineNum = 10; //定义每行显示多少个字
var num = 0;
var _ = document.createTextNode('_');
var i = 0;
function type() {
str = text.substr(i, 1);
var txt = document.getElementById('txt');
txt.appendChild(document.createTextNode(str));
txt.appendChild(_); num++;
if (num > 0 && num % lineNum == 0) txt.appendChild(document.createElement('br')); i++; if (i < textLen) setTimeout(function () { type(i) }, 300); else txt.removeChild(_);
}
</script>
</head>
<body onload="type()">
<div id="txt"></div>
</body>
</html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title> new document </title>
<style type="text/css">
#tcfr {
width: 200px;
height: 300px;
background: #99ccff;
font-size: 20px;
text-indent: 40px;
}
#tcfr p {
margin: 0px;}
</style>
</head><body>
<div id="tcfr">
</div>
<script type="text/javascript">
var str = "想在这个页面上插入一个或一个区域实现文字的逐字显示且能实现分行、缩进。\n这是云盘连接网页效果代码都已打包 师哥师姐们打开看一下就行！！谢谢";
var shtml = "";
function run()
{
var html=str.charAt(0);
shtml += html=="\n"?"</p><p>":html;
document.getElementById("tcfr").innerHTML = "<p>"+shtml+"</p>";
str=str.slice(1);
if(str!="")
setTimeout(run,100);
}
run();
</script>
</body>
</html>