根据用户选择编辑行

时间:2015-11-05 02:16:59

标签: jquery

使用下面的代码可以编辑row。但是当我尝试编辑另一行时,第一个单击的行仍处于可编辑状态。如何禁用它?

  $("#tableid").on("click", "tr", function () {
      $(this).find('td').each(function () {
          var matter = $(this).text();
          if (matter != "") {
              $(this).parents('tr').css('background-color', 'red');
              $(this).addClass("editclass");
              $(this).html("<input type='text' value='" + matter + "'/>");
              $(this).children().first().focus();

              $(this).children().first().keypress(function (e) {
                  if (e.which == 13) {
                      $(this).parents("tr").css("background-color", "white");
                      var newvalue = $(this).val();
                      $(this).parent().text(newvalue);
                      $(this).removeClass("editclass");
                  }
              });
          }
      });
      $(this).children().first().blur(function () {
          $(this).parent().text(matter);
          $(this).removeClass("editclass");
      });
      return false;
  });

1 个答案:

答案 0 :(得分:1)

单击tr时,只需执行删除tr中的类

喜欢这个

 $("#tableid td").each(function () {
     if ($(this).hasClass("editclass")) {
         $(this).parents("tr").css("background-color", "white");
         $(this).html($(this).find("input").val());
         $(this).removeClass("editclass");
     }
 })

JSFIDDLE