如何在jquery中获取用户可编辑的表值

Question

我试图将表中的所有值都放到一个对象中。但是我的表格既可编辑又只读<td>。如果我在可编辑的<td>中输入任何数据，我将无法使用以下代码获得相同的数据。请有人帮助我获得所需的结果。

var itemtbl = $('table#itemtable tr').map(function() {
    	return $(this).find('td').map(function() {
    		if($(this).find('input[type="text"],textarea').length) {
			alert("i am in text area");
		    return $(this).val();
		  } else {
			  alert("i am in readonly");
			  return $(this).text();
		  }
    		}).get();
    	}).get();

//table will be loaded dynamically as below and create both editable and non-ediatble<td>
$.each(responseJson, function(key,value) {
  var rowNew = $("<tr><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>");
  rowNew.children().eq(0).append(i);					            	  	  rowNew.children().eq(1).text(value['itemcode']);                  rowNew.children().eq(2).text(value['itemname']);                  rowNew.children().eq(3).text(value['receivedqty']);                rowNew.children().eq(4).html('<input type="text"  id="inspdate"/>');
  rowNew.children().eq(5).html('<input type="text"  id="accqty" onkeypress="return isNumber(event)"/>');
  rowNew.children().eq(6).html('<input type="text"  id="rejqty" class="reject"/>');
 rowNew.children().eq(7).html('<input type="text"  id="rema"/>');
 rowNew.appendTo($tbody);
 i++;
});

Answer 1

$("table#itemtable").find("tr").each(function(){
   // get each tr
   $(this).find("td").each(function{
   // handle each td in current tr
         if (!$(this).find("input"))
         {
            // no input elements here
            var data = $(this).text()
             // now data contains cell text
         }
   })
})

您的代码应更改为：

 var itemtbl = $('table#itemtable tr').map(function() {
    return $(this).find('td').map(function() {
        if($(this).find('input[type="text"],textarea').length) {
        alert("i am in text area");

        // $(this) will point to current <td> element, not to input
          //            return $(this).val();
         return $(this).find('input[type="text"],textarea').val();
        // and this is correct context

      } else {
          alert("i am in readonly");
          return $(this).text();
      }
        }).get();
    }).get();