點擊評論加入輸入框(筆記)

<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>評論</title>
<style>
.back{width: 300px; height: 200px; background: #ccc;}
.back span{ display: inline-block; vertical-align: top; width: 50px; background: #fff; height: 20px; margin:5px; text-align: center; cursor: pointer;}
.back span.active{background: #0b8;}
</style>
</head>
<body>
<textarea class="ipt"></textarea>
<div class="back">
<span>紅色</span>
<span>黃色</span>
<span>藍色</span>
<span>黑色</span>
</div>
</body>
<script src="jq/jquery-1.7.2.js"></script>
<script>
$(function(){
var arry=[];
$('.back>span').click(function(){
$(this).toggleClass('active');
var a=false;
for(var i=0;i<arry.length;i++){
if(arry[i]==$(this).text()){
arry.splice(i,1);
$('.ipt').text(arry);
a=true;
};
};
if(a==true){
return;
}else{
arry.push($(this).text());
$('.ipt').text(arry);
};
});
});
</script>
</html>html

相關文章
相關標籤/搜索