GridView如何用javascript实现点击某一列某一单元格来编辑单元格？

 <asp:GridView ID="GriSet" runat="server" AutoGenerateColumns="False" Width="98%" DataKeyNames="index_id">
          <Columns>
              <asp:TemplateField>
              <HeaderTemplate>
              <input id="cbAll" type="checkbox" onclick="GetAllCheckBox(this)" />
              </HeaderTemplate>
                  <ItemTemplate>
                      <asp:CheckBox ID="cheSelect" runat="server" />
                  </ItemTemplate>
              </asp:TemplateField>
              <asp:TemplateField HeaderText = "好友列表">
                  <ItemTemplate>
                      <%#Eval("Blog_friend_name")%>
                  </ItemTemplate>
              </asp:TemplateField>
              <asp:TemplateField HeaderText = "好友备注(限15字)">
                  <ItemTemplate>
                  <div onclick="ShowDIV(<%#Eval("index_id")%>)"><span  id="showdiv_<%#Eval("index_id") %>" style="display:block; "><%#Eval("Blog_friend_Description") %></span><span id="editdiv_<%#Eval("index_id") %>" style="display:none;"><asp:TextBox ID ="txtEdit" runat="server"></asp:TextBox></span></div>
                  </ItemTemplate>
              </asp:TemplateField>
              <asp:TemplateField HeaderText = "公开到好友秀">
                  <ItemTemplate>
                      <asp:ImageButton ID="imgbut" runat="server" />
                      <asp:HiddenField ID="hidid" runat="server" Value='<%#Eval("Blog_friend_is_Public") %>' />     
                  </ItemTemplate>
              </asp:TemplateField>
          </Columns>
      </asp:GridView>
      <br />
 <asp:Button ID = "btnEditor" runat="server" Text ="全部保存" OnClick="btnEditor_Click" />
  <script language="javascript" type="text/javascript">
  function ShowDIV(id)
  {
   document.getElementById("showdiv_"+id).style.display="none";
   document.getElementById("editdiv_"+id).style.display="block";
   //下面是实现点击单元格把td的值赋值给textBox。。有点问题。获取不到textBox的ID
   document.getElementById("txtEdit").innerHTML= document.getElementById("showdiv_"+id).value;
  }
  document.body.onclick=function(){ 
   //这边是循环遍历gridview。查看那些td里的值改变了。然后点击别的列（就是编辑那个单元格，离开那个单元格后，td的值显示的是你改变后的值）//下面该如何实现。。试了下。。实在写不出来。。感觉不知道如何下手。。麻烦会的人能给出代码参考。。因为没有代码让我根据思路去看怎么实现。。只靠几个中文，我还是不知道如何去实现。
   document.getElementById("showdiv_"+id).innerHTML= document.getElementById("txtEdit").value;
  }
  </script>