快捷添加标签js问题

肖申克救赎 发布于 2013/06/21 19:47
阅读 188
收藏 0
<title>类似评论、点评的JS标签选择功能</title>
<style>
.c{ 
width:100px; 
height:25px; 
line-height:25px; 
text-align:center; 
border:1px solid #eee; 
margin:10px; 
float:left; 
font-size:12px; 
cursor:pointer 
}
</style>
</head>
<body>
<div class="c" id="c0">啤酒</div>
<div class="c" id="c1">香烟</div>
<div class="c" id="c2">饮料</div>
<div class="c" id="c3">瓜子</div>
<div class="c" id="c4">水果</div>
<div class="c" id="c5">茶水</div>
<input id="i" type="text" style="width:720px; height:25px; border:1px solid #ccc"/>
<script>
var x=["啤酒","香烟","饮料","瓜子","水果","茶水"];
var y=[];
function $(id){ return document.getElementById(id)};
for(var i=0,m=x.length;i<m;i++){
    $("c"+i).onclick=(function(i){
        return function(){
            var s=y.join(",").indexOf(x[i]);
     if(s>=0){
        for(var r in y){
            if(y[r]==x[i]){y.splice(r,1)}
            }
         }
        else{
            y.push(x[i])
            }
            
        $("i").value=y.join(" ");
        }
        })(i)
    
    }
</script>

效果图

当选择标签后,如何让已选择的标签变颜色,取消之后变回呢?

加载中
0
blindcat
blindcat

再设一个样式,比如

.on {color:#FF0;}

点击的时候,attr判断元素是否有这个样式,有就remove,没有就add

肖申克救赎
肖申克救赎
代码是copy别人的,基本上个js盲
肖申克救赎
肖申克救赎
谢谢
返回顶部
顶部