点击评论加入输入框（笔记）

最新推荐文章于 2023-10-06 13:01:52 发布

weixin_30384217

最新推荐文章于 2023-10-06 13:01:52 发布

阅读量332

点赞数

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/nameless-212/p/6420229.html

本文介绍了一个简单的HTML颜色选择器实现方案。通过点击不同的颜色标签，用户可以为文本区域选择背景颜色。该方案使用了jQuery来处理点击事件并更新文本区域的内容。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<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>