今天在开发中遇到的JSP结合JS的一个校问题,个人觉的解决方法蛮值得参考的。总结起来就是:把方法中的可变部分抽取出来作为参数传入方法。一个很经典程序员都懂的方法,在此提出只为提醒自己。
废话不多说,先看看源码吧:
<!-- 先说明下,此段代码是在循环中调用的即 <s:iterator>中,为重复利用的组件 -->
<input class="del_num" id="${product.id}" type="text" size="3" maxlength="4"/>
<a οnclick="changeQuantity();" >变更</a>
<script>
function changeQuantity(){
var id = ${product.id}; //内部获取的数据已经为循环的最后一位数了。
var qty = document.getElementById(id).value;
var b = window.confirm("确认更改数量为" + qty);
if (b) {
window.location="${pageContext.request.contextPath }/cart/modify?pid="+id+"&qty="+qty;
<span style="white-space:pre"> </span>}
}
}
</script>
这个是为了更改购物车中物品数量的一段代码,为了动态的给重复使用的组件命名,使用了EL表达式给组件命名,由此而来的一个问题是:获取组件中的内容。
采用上面那段代码,在JS中获取组件id时总总发现只能获取到最后一个组件的id,后分析得是由于循环问题使得最后统一获得的id为最后一个组件的id。
后改为:
<input class="del_num" id="${product.id}" type="text" size="3" maxlength="4"/>
<a οnclick="changeQuantity(${product.id});" >变更</a>
<script>
function changeQuantity(id){
//var id = ${product.id}; //内部获取的数据已经为循环的最后一位数了。
var qty = document.getElementById(id).value;
var b = window.confirm("确认更改数量为" + qty);
if (b) {
window.location="${pageContext.request.contextPath }/cart/modify?pid="+id+"&qty="+qty;
}
}
</script>
其中把获取id的任务封装到了参数,改为由点击时传入进来。由此动态的获取到了相应的id,问题解决。