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

首页-代码 2014-03-22 09:33:20 -0400

★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

泡沫的、恋 (@ailiyishen) | @ at 2014-03-23 06:48:
#不错#

45310095 (@453100956) | @ at 2014-03-23 03:01:
#不错#

万老板 (@wjt) | @ at 2014-03-22 18:19:
#我勒个去#

笑忘书 (@35230) | @ at 2014-03-22 11:40:
其实这个代码还算比较简单，毕竟我暂时了解的相关知识很少，没办法写的更好点。对JavaScript兴趣挺大，不过高中没打算花时间学这个，等高考完再说吧

ヾ明月醉淸風 (@1223302216) | @ at 2014-03-22 11:03:
不错，勉强看得懂代码，这天刚学到onclick等这些事件

晨曦995 (@sky995) | @ at 2014-03-22 10:38:
#我勒个去#

咸 (@wap125) | @ at 2014-03-22 10:26:
#无感#

咸 (@wap125) | @ at 2014-03-22 10:26:
#我勒个去#

咸 (@wap125) | @ at 2014-03-22 10:26:
#还行#

追梦小窝 (@yzm) | @ at 2014-03-22 10:24:
#我勒个去#

翱翔的雄鹰 (@axdxy) | @ at 2014-03-22 10:19:
#不错#

csngmap (@csngmap) | @ at 2014-03-22 09:59:
#不错#

流沙 (@liusha) | @ at 2014-03-22 09:51:
#我勒个去#

笑忘书 (@35230) | @ at 2014-03-22 09:49:
#还行#

小陌 (@xiaohehe) | @ at 2014-03-22 09:47:
#不错#

Pg.: 1 2

Subscribe | Register | Login | N