javascript - jeditable 在 grails 中的工作

Question

在 jeditable 中，我有三个文本框，每个文本框都有自己的提交按钮，但我的问题是当我尝试通过单击其提交按钮来编辑第一个文本框时，编辑后的值会更新到所有文本框，我的代码如下：

function editCheckList()
{
 checkId=$(this).context.id;
 oldName=$("#checkListTitle").text();
 var form1="<div class='editable'><form id='editForm'>"+
    "<input type='text' id='checklist' class='checktextbox' value='"+ oldName+"' 
     name='checklist' />"+
    "<button id='saveRename'class= 'addTabButton cbtn' ><img src='css/ui-lightness/images/save.jpg' align='middle'></button>"+
    "<button id='cancelRename' ><span>Cancel</span></button>"+
    "</form></div>"

 $("#checkListTitle").after(form1).remove();

 $("#saveRename").unbind('click').click(function(){
   $("#editForm").submit()
   return false;
 });

 $("#cancelRename").unbind('click').click(function(){
   replaceName( false, this, oldName );
 return false;
 });

 $("#editForm").unbind('submit').submit(function(e) {
   replaceName( true, oldName, $("#checklist").val() );
   e.preventDefault();
   return false;
 });

 function replaceName( action, obj, val) {
   if ( val == '' ) {
     val = 'Untitled';
   }
   val=$('#checklist').val();
   alert(val);
   $("div.editable").after('<span id='+checkId+'>'+ val +'</span>').remove();
   $("#saveRename, #cancelRename,#editForm").unbind();
 }
}

我希望每个文本框在单击其提交按钮时独立更新。