Question

我是Jquery的新手我想在

中保存输入的值

我的结构就像这样

<td><input type="text" class="txtbox" value="" /></td>

现在，当用户在第一个tr中输入值并点击保存时，该值将显示在相应的td中，并且不应该是可编辑的，并且保存按钮将更改为“编辑”按钮

这里是jsfiddle

http://jsfiddle.net/nikkirs/0qjsag8h/

Answer 1

你需要迭代当前点击的行中的所有td元素保存按钮并设置每个tds text / html：

$("#savebtn").click(function(){
  if ($('.test tr:last input:text[value]').length == 0) {
    alert("FAIL - all textboxes on last row are empty.");  
  } 
  else {
        alert('SUCCESS - at least 1 value is filled in!');
        this.value = 'Edit';

        $(this).parent().siblings().each(function(){
        $(this).text($(this).find('input').val())
        });
    }
});

<强> Working Demo

Answer 2

只需将此功能更改为：

$("#savebtn").click(function(){
  if($(this).val()=="Edit")
  {
      this.value = 'Save';
      $(this).closest("tr").find('input[type=text]').each(function(){
                $(this).removeAttr("disabled");
      });}
  else{ if ($('.test tr:last input:text[value]').length == 0) {
  alert("FAIL - all textboxes on last row are empty.");  
        } 
        else {                $(this).closest("tr").find('input[type=text]').each(function(){
                $(this).attr("disabled","");
            });
            alert('SUCCESS - at least 1 value is filled in!');
            this.value = 'Edit';            
        }

      }
  });

现在，一旦点击保存，您将无法编辑值。只有在单击编辑按钮后才能执行此操作。

<强> Working Demo

使用jquery将输入的值存储在TD中

2 个答案: