js按钮获取表单内容
2016-12-06 16:22
465 查看
参照问题
js 表格的每一行都有一个按钮 点击按钮修改当前行某一列的信息 <table><tbody> <tr> <td>4</td> <td id='r'>5<td> <td><a href="#"><button type="button" >修改</button></a></td> <td><a href="#"><button type="button" >保存</button></a></td> </tr> </tbody></table> 这个tr里的内容是循环出来的,每一行都有一个修改的按钮 ,现在想点击某一行的按钮修改每一行中id='r'这一个td的值
解决答案
<table><tbody> <tr> <td>4</td> <td id='r'>5<td> <td><a href="#"><button type="button" onclick="update(this)">修改</button></a></td> <td><a href="#"><button type="button" onclick="save(this)">保存</button></a></td> </tr> </tbody></table> =================== var update = function(btn){ var tr = btn.parentElement.parentElement.parentElement; var td = tr.cells[1]; var txt = document.createElement("input"); txt.type="text"; txt.value = td.innerHTML; td.innerHTML = ""; td.appendChild(txt); } var save = function(btn){ var tr = btn.parentElement.parentElement.parentElement; var td = tr.cells[1]; td.innerHTML = td.children[0].value; }
自己的问题
每个商品点击加入购物车可以进行数据提交商品列表: <table border=1> <tr> <td>商品编号</td> <td>商品名称</td> <td>商品价格</td> <td>商品描述</td> <td>购买数量</td> </tr> <c:forEach items="${page.data }" var="item"> <tr class="additem" id="additem"> <td><input type="text" value="${item.item_id }" name="item_id" readonly style="border: 0px;" /></td> <td><input type="text" value="${item.item_name }" name="item_name" readonly style="border: 0px;" /></td> <td><input type="text" value="${item.item_price }" name="item_price" readonly style="border: 0px;" />元</td> <td><input type="text" value="${item.item_detail }" style="border: 0px;" name="item_detail" readonly /></td> <td><input class="min" name="" type="button" value="-" /> <input class="text_box" name="count" type="text" value="0" id="num" style="width: 25px;" /> <input class="add" name="" type="button" value="+" /></td> <td><input type="button" value="加入购物车" onclick="addsuccess(this)"></td> </tr> </c:forEach> </table>
<script language="javascript"> //验证元素是否获取到 /* function addsuccess(btn){ //var rowIndex = obj.parentElement.rowIndex; var tr = btn.parentElement.parentElement; var td = tr.cells[0]; // alert(td.innerHTML); alert(td.children[0].value); } */ //获取数据并提交 function addsuccess(btn){ var users_id = document.getElementById("users_id").value; var tr = btn.parentElement.parentElement; //var tr = btn.parent.parent; var item_id = tr.cells[0].children[0].value; var item_name = tr.cells[1].children[0].value; var item_price = tr.cells[2].children[0].value; var count = tr.cells[4].children[1].value; //alert(item_id+"+"+item_name+"+"+item_price+"+"+count); if(count > 0){ $.post("${pageContext.request.contextPath }/addItems.do" , {users_id:users_id,item_id:item_id,item_name:item_name,item_price:item_price,count:count}, function(msg){ if(msg == "加入购物车成功"){ //num.setAttribute("value", 0); var msg1 = "商品"+item_id+msg; alert(msg1); tr.cells[4].children[1].value = 0; }else{ alert(msg); } }); /* this.document.addItem.action = "${pageContext.request.contextPath }/addItems.do"; document.addItem.submit(); alert("加入购物车成功"); num.setAttribute("value", 0); */ }else{ alert("商品数量不能为0!"); } } //商品数量的加减 $(document).ready(function() { //加的效果 $(".add").click(function() { var n = $(this).prev().val(); var num = parseInt(n) + 1; if (num == -1) { return; } $(this).prev().val(num); }); //减的效果 $(".min").click(function() { var n = $(this).next().val(); var num = parseInt(n) - 1; if (num == -1) { return } $(this).next().val(num); }); }) </script>
相关文章推荐
- js获取fckeditor表单内容
- js实现不提交表单获取单选按钮值的方法
- js获取fckeditor表单内容和相关fckeditor设置
- 使用JS获取表单元素里面的内容
- js实现不提交表单获取单选按钮值的方法
- js获取fckeditor表单内容
- 点击按钮触发js获取标签里的内容并修改
- JS中获取表单的相应内容
- js简单获取表单中单选按钮值的方法
- 表单提交到下一个页面后,再点击IE上的后退,如何能让表单内容再次显示出来?(以及当前页禁止IE返回按钮js)
- (转)JS正则表达式获取分组内容的方法
- JS获取单选按钮的值
- jQuery 练习[二]: 获取对象(3) - 根据属性、内容匹配, 还有表单元素匹配
- JS获取一个表单字段中多条数据并转化为json格式
- 前端知识点整理之表单输入事件的兼容写法,js常用关键字,获取标签元素的写法
- PhantomJS(webkit)/SlimerJS (Gecko) + CasperJS获取JavaScript渲染后的网页内容
- 原生JS实现表单checkbook获取已选择的值
- JS 正则表达式 获取小括号 中括号 花括号内的内容
- js实现点击按钮复制文本框中的内容
- js操作Iframe(获取Iframe中的节点内容)