代码之家 › 专栏 › 技术社区 › Apollo giaset

在两个括号内插入文本-Javascript

html javascript

Apollo giaset · 技术社区 · 11 年前

我想有一个打字机的效果,这样我就可以从{}开始,单词的每个字母每120毫秒就被打一次。我几乎用以下代码完成了这一点:

Java脚本

<script type='text/javascript'>
var index = 0;
var text = 'hello'

// Here you can put in the text you want to make it type.
function type()
{
    document.getElementById('screen').innerHTML += text.charAt(index);
    index += 1;
    var t = setTimeout('type()',120);
}
</script>

HTML格式

<html>
<body onload="type()">
...
<div id='screen'>{</div>
...
</body>
</html>

我的问题是,当单词输入时,没有右括号。因此,在最初的120毫秒之后,它看起来是这样的:{h

但我希望它看起来像这样

我怎样才能解决这个问题?

2 回复 | 直到 11 年前

Diego López 11 年前

在这里查看 http://jsfiddle.net/p56awrea/2

<script type='text/javascript'>
var index = 0;
var text = 'hello'
var current = ''

// Here you can put in the text you want to make it type.
function type()
{
document.getElementById('screen').innerHTML = '{'+current+'}';
current+=text.charAt(index);
index += 1;

if(index==text.length+1){
    current = '';
    index=0;
    setTimeout('type()',2000);

} else {
 setTimeout('type()',120);
}
}    


</script>
<body onload="type()">
...
<div id='screen'>{}</div>

编辑 :在循环行为之前添加了2秒延迟

wandering-geek 11 年前

将HTML更改为以下格式如何?

<html>
<body onload="type()">
...
<div>&#123;<span id='screen'></span>&#125;</div>
...
</body>
</html>

我使用的是等效的HTML实体,而不是原始的大括号字符。

编辑: 将#screen元素从div更改为span,这是一个内联元素

现在,您将始终在插入的文本周围使用左大括号和右大括号。

推荐文章

code-geek · Jquery根据单选按钮选择隐藏或显示文本字段

1 年前

Jamie · 在CSS链接的文件名中添加Jinja占位符

1 年前

ptownbro · 重叠分区标签,同时保持以下所有分区和内容就位

1 年前

Luke Frost IEng MIMechE · Bootstrap 5.3在Div中的项目位置没有如我所期望的那样显示

1 年前

Reegan · 使用Angular ngFor指令在html中渲染嵌套对象值

1 年前

wqyutv · 当找不到文件时,任何破坏错误的东西都不会出现,我该怎么解决这个问题?

1 年前

user29519291 · 为不同的变量创建一个带有可重用Click函数的简单菜单

1 年前

Gukkey · 在React中明确隐藏日期类型输入后,如果我单击父div,如何显示日期选择器?

1 年前

Lorenzo Bertolaccini · 在Angular项目中通过对话框后,在控制台中显示但在HTML中不显示的数据数组

1 年前

john Rizzo · 按钮背景颜色、悬停和活动状态存在问题

1 年前