使用nextSibling获取checkbox后面的文本内容，并传给后台

获取checkBox的文本值，用逗号隔开传给后台。

代码如下图所示：

<div class="control-group"><label class="control-label">所属区:</label><div class="controls"><c:forEach items="${areaList}" var="a"><input id="manageAreaCode" name="manageAreaCode" type="checkbox" value="${a.code}" <c:if test="${fn:contains(user.manageAreaCode, a.code)}">checked</c:if>/>${a.name}</c:forEach><input type="hidden" id="manageAreaName" name="manageAreaName" value="${user.manageAreaName}" /></div></div>

nextSibling是获得当前对象的下一个对象
nodeValue是返回一个节点的值

<script type="text/javascript">
var paramName = ""; //获取参数
var position = document.getElementsByTagName("input");//获取页面上所有的input
//获取监测参数
for(var i = 0; i < position.length; i++) {if(position[i].name == "manageAreaCode" && position[i].checked == true) {paramName += (position[i].nextSibling.nodeValue + ","); // 得到checkBox文本内容，并用,隔开}
}
$("#manageAreaName").val(paramName.substring(0,paramName.length-1));
</script>

亲测真实有效，因为用的是原生的form表单提交，所以个人感觉有点麻烦。

使用nextSibling获取checkbox后面的文本内容，并传给后台相关推荐

获取checkbox后面的文本内容
一段简单的js就能获取checkbox后面的文本. <head> <meta http-equiv="Content-Type" content="te ...
前端调用麦克风获取实时音频流和录音并上传至后台
前端调用麦克风获取实时音频流和录音并上传至后台 index.html <!DOCTYPE html> < a href=" ">Default.html&l ...
JavaScript 技术篇-textContent获取dom节点text文本内容带空格，js获取带空格的dom节点内容
我们用 innerText 获取到的文本信息是除掉空格的.但有时根据需求我们需要获取到完整的文本信息. 请看效果图: 用 textContent 就可以很好的解决了. 喜欢的点个赞❤吧!
jq循环获取table中各td中input框的内容 ajax传到后台
页面图: (点击确定后,将各td内容获取到,然后ajax传出,php接收然后传入数据库) 1.先放html的页面代码(用了bookstrap框架): <table class="tab ...
获取用户输入到input的内容并传给后台拿数据
实现效果图 <html> <head> <script language="javascript"> function print(){ var ...
js获取摄像头中的视频流并上传到后台
今天研究了下js获取摄像头中的视频流,全网搜索相关的文章,终于上天不负有心人.以下是原文代码: index.html: <!DOCTYPE html> <html><he ...
Java 后端接收前端的富文本参数，传到后台后标签样式数据丢失
问题描述: 前端传参的时候,某个参数中是富文本格式,格式如下: { "id": "698002e34cb64156ade62a073699f5d9", &q ...
dom(一)——获取文本内容的方法
在利用DOM获取节点之后有多种方法可以获取节点中的文本内容 1. innerHTML innerHTML可以作为获取文本的方法也可以作为修改文本内容的方法 element.innerHTML 会 ...
js设置和获取html和文本,JS---DOM---设置和获取---标签内容和文本内容
设置和获取---标签内容和文本内容总结---设置: 使用innerText主要是设置文本的, 设置标签内容, 是没有标签的效果的 innerHTML是可以设置文本内容 innerHTML主要的作用是 ...

使用nextSibling获取checkbox后面的文本内容，并传给后台

使用nextSibling获取checkbox后面的文本内容，并传给后台相关推荐

最新文章

热门文章