Javascript_如何给input连续赋值
21视频教程网3月21日整理
学生：
在写一个选择热门标签的JS,就是为一个文档框连续赋值,但遇到一个麻烦的问题,我每次只能赋一个值,水平有限,摸索了半天未果,请高手们给我个解决方法.感谢.
实例说明:
想实现的效果是: 点击选择标签后面的值后,值会自动加到id为demo的文本域中,且可连续选择多个标签.
代码如下:
<input type="text" id="demo" size="30" />
<br>
选择标签: <a href="javascript:void(0)" onclick="checktag">标签一</a>  <a href="javascript:void(0)" onclick="checktag">标签二</a>  <a href="javascript:void(0)" onclick="checktag">标签三</a>  <a href="javascript:void(0)" onclick="checktag">标签一</a>  <a href="javascript:void(0)" onclick="checktag">标签四</a>  <a href="javascript:void(0)" onclick="checktag">标签五</a>
Javascript视频教程编辑部：
<!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">
<head>
<title>runcode</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="Author" content="Sheneyan" />
<script type="text/javascript">
$ = function(id){return document.getElementById(id);}
var tags = [];//存放标签，避免重复加入。具体标签的结构你自己定义，我是根据你已有的代码写的。
var SPLITCHAR = ',';//设定分隔符是,
//这里假设你的单击tag的含义是只添加不删除。
function checktag(o){
var d = $('demo');
tags = d.value.split(SPLITCHAR);
var v = o.innerHTML;//如果你的tag有别的值或者别的非innerHTML里体现的内容，自行修改。
if (tags.length==0){
d.value=s=v;
tags.push(v);
}
else{
var s = SPLITCHAR+tags.join(SPLITCHAR)+SPLITCHAR
if (!new RegExp(SPLITCHAR+v+SPLITCHAR,'g').test(s)){
s+=v;
}
s = s.replace(new RegExp("(^"+SPLITCHAR+"|"+SPLITCHAR+"$)","g"),'');
d.value = s;
tags = s.split(SPLITCHAR);
}
}
</script>
</head>
<body>
<input type="text" id="demo" size="100" />
<br>
选择标签: <a href="javascript:void(0)" onclick="checktag(this)">1</a>  <a href="javascript:void(0)" onclick="checktag(this)">2</a>  <a href="javascript:void(0)" onclick="checktag(this)">3</a>  <a href="javascript:void(0)" onclick="checktag(this)">4</a>  <a href="javascript:void(0)" onclick="checktag(this)">5</a>  <a href="javascript:void(0)" onclick="checktag(this)">6</a>
<br>
</body>
</html>
Javascript视频教程编辑部
| Word教程网 | Excel教程网 | Dreamweaver教程网 | Fireworks教程网 | PPT教程网 | FLASH教程网 | PS教程网 |
| HTML教程网 | DIV CSS教程网 | FLASH AS教程网 | ACCESS教程网 | SQL SERVER教程网 | C语言教程网 | JAVASCRIPT教程网 |
| ASP教程网 | ASP.NET教程网 | CorelDraw教程网 |
QQ：2693987339(点击联系)购买教程光盘
:
