JQuery – 从选定的表行获取值

我有一个包含多个元素的表。 第一个元素是一个复选框,它将在Javascript中触发事件。 我需要做的是:1。检查复选框值是否为真2.如果为true,则从表元素中获取值a。 一些列值是文本b。 一些列包含文本框(

Select/Change and Update Selections
Select Class Desc Weight Pott Dia Pott Ht Pott Stack Ht Tower Width
00100 C100 XL
00140 C200S CL
00140 C200S CU

目前,我有以下内容:

  rowSelect: function(event) { var work = []; // var rowIndex = $(this).parent().parent().children().index($(this).parent()); var chkbox = $(this).closest('tr').find('td:eq(0)').child(0); if(null != chkbox && true == chkbox.checked){ for(var i=0;i<17;i++){ if(i<3){ var s = $(this).closest('tr').find('td:eq(i)').text(); } else{ var s = $(this).closest('tr').find('td:eq(i)').val(); } work[i]=s; } } } 

问题是在我开始尝试获取复选框的值(已选中或未选中)时。 我以为我可以抓住对象,然后检查val(),或者只是从孩子那里得到val(),但还没有任何工作。 我需要的是一种获取复选框值的方法,并从文本输入框中获取值。

我有一个小提琴解决方案: http : //jsfiddle.net/radi8/tCh3P/19/

—->解决方案<—-

好的,这是我的最终解决方案,使用下面提供的function以及其他任何关心的外观。 我将其更改为填充JSON而不是使用数组,但整体function有效。

  var proddta = { init: function(){ // hook into the get delete/update buttons var del = $("#delete"); for (var i = 0, ii = del.length; i < ii; i++){ $(del).bind("click", proddta.deleteListener2); } var upd = $("#update"); for (var i = 0, ii = upd.length; i < ii; i++){ $(upd).bind("click", proddta.updateListener); } }, updateListener: function(event){ myJSON = new Object(); $('.prodSel:checked').each(function() { proddta.getArrays(this, myJSON); var dataString = JSON.stringify(myJSON); alert('dastring: '+dataString); /* var url = 'http://'+window.location.hostname+'/truck/webServices/products.svc.php?update=1'; $.post(url, {data: dataString}, function(res){ proddta.showResult(res); }); */ }); }, deleteListener2: function(event){ myJSON = new Object(); $('.prodSel:checked').each(function(){ proddta.getArrays(this, myJSON); var dataString = JSON.stringify(myJSON); /* var url = 'http://'+window.location.hostname+'/truck/webServices/products.svc.php?update=0'; $.post(url, {data: dataString}, function(res){ var obj = $.evalJSON(res); if(obj.somebool === true) $("#result").html(obj.hello + ' ' + obj.array[1] + obj.worked + ". Message from PHP: "+obj.php_message); }); */ alert('dastring: '+dataString); }); }, getArrays: function(evt, myjson){ var val = proddta.getColumnCount(this); $closestTr = $(evt).closest('tr'); var chkbox = $closestTr.find('td:eq(0)').find(':checkbox'); if (null !== chkbox && true === chkbox.is(':checked')) { var s = ''; var id = ''; for (var i = 1; i = 1 && i < 4) { s = $closestTr.find('td:eq(' + i + ')').text(); id = $closestTr.find('td:eq(' + i + ')').attr('id'); } else { s = $closestTr.find('td:eq(' + i + ')').find(':input').val(); id = $closestTr.find('td:eq(' + i + ')').find(':input').attr('id'); } myjson[id] = s; } } else { // handle this exception... } }, getColumnCount: function(evt){ var colCount = 0; $('tr:nth-child(1) td').each(function () { if ($(this).attr('colspan')) { colCount += +$(this).attr('colspan'); } else { colCount++; } }); alert(colCount); return colCount; }, } proddta.init(); 

要找到复选框:

 var checkbox = $(this).closest().find('input:checkbox:first'); if (checkbox.is(':checked')){ // checkbox is checked } 

参考文献:

  • :checkbox选择器 。
  • :checked选择器 。
  • find()
  • :first选择器
  • .is()

你的代码需要一堆修复,最后才有效。 见下文,

DEMO

 rowSelect: function(event) { alert('hello 1'); var work = []; var $closestTr = $(this).closest('tr'); var chkbox = $closestTr.find('td:eq(0)').find(':checkbox'); alert('hello 2 ' + chkbox.is(':checked')); if (null !== chkbox && true === chkbox.is(':checked')) { alert('hello 3'); var s = ''; for (var i = 0; i < 17; i++) { if (i != 0 && i < 4) { s = $closestTr.find('td:eq(' + i + ')').text(); } else { s = $closestTr.find('td:eq(' + i + ')').find(':input').val(); } work.push(s); } } else { alert('hello 99'); } alert('hello 4 ' + work.join(' ')); } 

chkbox变量声明更改为:

 var chkbox = $(this).parents('tr').find('input[type=checkbox]').get(0);