jquery 单击事件 局部变量 越界 问题

问题描述 
从数据库中读取出N条记录 
每条记录都对应一个按钮 
使用Jquery为每个按钮增加一个单击事件 
单击按钮 
所在行要进行更新的单元格数据 
变成输入框可以更新所在行的数据 JavaScript文件代
$(document).ready(function() {   
  
    // 为修改按钮注册单击事件   
    var modifies = $(".modify");   
       
    for (var i =0; i < modifies.length; i++) {   
           
        $(modifies[i]).click(function() {   
               
               
            // 定位该修改按钮所在表单中typeName所在Td位置   
            // 注：查找的是Id   
            alert(i);   
            var typeName = "#" + (i+1) + "_typeNameCn";   
            var typeNameTd = $(typeName);   
  
            // 保存单元格中的数据   
            var text = typeNameTd.text();   
  
            // 清空td里面的内容   
            typeNameTd.empty();   
            alert(text);   
            // 建立一个文本框，即一个input的元素节点   
            // 注：name属性的命名要和action中的命名一致   
            var input = $("<input type=\"text\" name=\"mt.typeNameCn\" />");   
  
            // 设置文本框的值是保存起来的文本内容   
            input.attr("value", text);   
               
            // 将文本框中的内容加入到td中   
            typeNameTd.append( input );   
               
            // 隐藏"修改"按钮   
            $(modifies[i]).css("display","none");   
               
            // 找到提交按钮，让提交按钮显示出来   
            var submit = "#" + i +"_submit";   
            $(submit).css("display","block");   
  
        });   
    }   
       
  
});  jsp文件代码 <table>   
    <tr>   
        <td>   
            杂志类型编号   
        </td>   
        <td>   
            杂志类型名称   
        </td>   
        <td>   
            操作   
        </td>   
    </tr>   
  
    <s:iterator value="mts">   
        <s:form name="editMagazineTypeForm" method="post" theme="simple">   
            <tr>   
                <td>   
                    <s:property value="typeId" />   
                    &nbsp;   
                </td>   
                <%   
                    //指定对应的id值，便于定位单元格   
                %>   
                <td id="${typeId}_typeNameCn">   
                    <s:property value="typeNameCn" />   
                </td>   
                <td>   
                    <s:hidden name="mt.typeId" value="%{typeId}"></s:hidden>   
                    <s:submit value="修改fdfdf" onclick="this.disabled='true'"  
                        cssStyle="display:none;"></s:submit>   
                    <button class="modify" onclick="%{typeId}">   
                        修改   
                    </button>   
                </td>   
            </tr>   
        </s:form>   
    </s:iterator>   
  
</table>  问题：当我单击按钮之后，经过断点测试发现 
for循环中的i变量不是0而是2 也就是说局部变量在完成循环之后 
并没有从内存中清除 
而是保留了下来 
继续递增 不知道这样的描述是否正确 请帮忙告知如何解决 
谢谢