[代码收集]JS选择评价添加至输入框的评论代码(仅限一项/清空询问) - 笑忘书网页代码收藏馆

首页-代码 2014-03-22 06:33:20 -0700

★JS选择评价添加至输入框的评论代码(仅限一项/清空询问)★

请勿抄袭本页面

代码说明

点击选项将添加相应的内容至输入框，仅限选择其中一项(需检测特定字符串)。增加了一个清空输入内容的按钮，且点击将弹窗询问"是否确认删除"，可防止误删。本代码由@笑忘书 编写

使用方法及注意事项使用前请先阅读本内容

复制后请先修改评论ID(即评论页面的地址后面的几个数字，如本页地址为http://35230.wodemo.com/entry/273140，则273140为评论ID)。添加内容修改位置: addText('这里填要被添加到输入框的内容')。更详细的修改注释请看代码

html代码

/* 评价代码的选项区域定义 */
.com_x{
border:1px solid green;
margin:3px 4px;
}

/* 评价代码的单个选项定义 */
.com_x a{
background:#F5F5F5;
border-radius:3px;
border:1px solid grey;
padding:3px 4px;
margin:2px 4px;
}

/* 评价代码的输入框定义 */
#com_text{
margin-top:5px;
width:80%;
}

/* 评价代码的提交按钮定义 */
#com input[type="submit"]{
margin-right:1em;
}
</style>

<script type="text/javascript">
function addText(text){
 var srk = document.getElementById("com_text");
if(srk.value.indexOf("#")==-1){
//检测输入框中是否含有选项必含内容(即"#")
 srk.value += "#"+text+"#";
//给选项文字增添字符串(即"#"和"#") ，并全部添加到输入框
}
else{
alert("您已经选择了一项，如需更换请点击清空原内容");
//若输入框中含有检测字符串，则弹窗显示本内容
}
}
function textReset(){
if(confirm("你确定要清空评论吗？")){
document.getElementById("com_text").value="";
//确认则清空输入框内容
}
else{
return false;
}
} 
</script>
<form method="POST" action="http://s.wodemo.com/" id="com"> 
<div id="com_t">请选择一项评论本文(不选亦可)</div>
<span class="com_x"><a onclick="addText('不错');return false;">不错</a><a onclick="addText('还行');return false;">还行</a><a onclick="addText('无感');return false;">无感</a><a onclick="addText('我勒个去');return false;">吐槽</a></span>
<input type="hidden" name="act" value="file_talk" />
<input type="hidden" name="fid" value="评论ID" />
<textarea name="content" id="com_text"></textarea>
<br>
<input type="submit" value="提交评论"/><input type="button" value="清空内容" onclick="textReset();">
</form>

代码演示

[代码仅供参考，转载请注明出处]

----Comments(45)----

Pg.: 1 2

吢飛翔 (@xfx) | @ at 2017-11-01 06:07:
#不错#

珍游趣 (@cjz) | @ at 2015-09-17 07:08:
#无感#

坐墙等红杏 (@1272184753) | @ at 2015-08-16 04:42:
#不错#

RaMos丶蓝魔 (@vendor) | @ at 2015-07-07 02:46:
#我勒个去#

ZGH (@zgh2606) | @ at 2015-06-26 08:37:
#我勒个去#

nixanim (@nixanim) | @ at 2015-03-10 08:20:
#axjxk#

nixanim (@nixanim) | @ at 2015-03-10 08:19:
duid

jrj (@jrj) | @ at 2015-02-26 17:42:
#不错#

nixanim (@nixanim) | @ at 2015-02-02 18:33:
#无感#

nixanim (@nixanim) | @ at 2015-02-02 18:33:
#不错#

红尘客栈 (@ljz) | @ at 2014-11-05 03:30:
很好#不错#

BOOK_思义 (@rupjw) | @ at 2014-09-06 09:08:
#不错#

@ivku | @ at 2014-08-17 05:00:
#我勒个去#

追梦小窝 (@yzm) | @ at 2014-08-08 09:43:
#还行#

jrj (@jrj) | @ at 2014-07-23 18:40:
#无感#

@365lr | @ at 2014-07-15 03:39:
#不错#

豆子 (@dou) | @ at 2014-07-01 02:30:
#还行#hehe

辉少 (@fktk) | @ at 2014-06-13 23:16:
#不错#咯

Dearfeat (@686) | @ at 2014-06-07 18:59:
#无感#

风潇潇 (@chenf) | @ at 2014-05-26 05:21:
#不错#

辉少 (@fktk) | @ at 2014-04-30 02:29:
#我勒个去#

小孩 (@luchaorong) | @ at 2014-03-29 18:20:
#卟错#

小孩 (@luchaorong) | @ at 2014-03-29 18:19:
#不错#

耀眼阳光 (@luozhihao) | @ at 2014-03-29 05:21:
#不错#

耀眼阳光 (@luozhihao) | @ at 2014-03-29 05:21:
#无感#

じ羁绊 (@uu) | @ at 2014-03-27 09:04:
#不错#

工藤新一 (@gtxy) | @ at 2014-03-25 11:49:
#不错#留下足迹~

日长飞絮轻 (@yuanma) | @ at 2014-03-24 06:38:
哈哈#不错#

小三 (@xskj) | @ at 2014-03-23 18:28:
#不错#

加壹 (@wip) | @ at 2014-03-23 05:43:
#不错，好叼的感觉#

Pg.: 1 2

Subscribe | Register | Login | N