Question

我有一张像

这样的表格

        <table>
           <thead>
            ...
           </thead>

            <tbody>
              <tr>
               <td><input id="1" type="checkbox"/></td>
                ..
                <td class="email">esha@gmail.com</td>
              </tr>

               <tr>
               <td><input id="2" type="checkbox"/></td>
                ..
                <td class="email">Nisha@gmail.com</td>
              </tr>
             ...  
           </tbody>
        </table>
        ...
        ...
        <input type="button" onclick="saveAndSend()" />

           function saveAndSend()
               {
                  var ele = $("tbody").find('input');
                  if(ele.is(':checked')){
                   var studentList = "1,2";
                   var emailAddresses = "esha@gmail.com, Nisha@gmail";
                  });
               }

现在在jQuery中，我想获取表中所有选中/选中复选框的id 并将它们放在一个变量中，并获取表中所选/已选中复选框的电子邮件地址，并将它们放在另一个变量中。

请帮帮我!!!

Answer 1

您需要迭代:checked复选框，然后使用DOM遍历方法来定位email元素。

＆＃13;

$(function() {
  $('#saveAndSend').on('click', function() {
    //Iterate and create an array
    var arr = $("table").find(':checkbox:checked').map(function() {
      var $this = $(this)
      return {
        id: $this.attr('id'),
        email: $this.closest('tr').find('.email').text()
      }
    }).get();

    var ids = arr.map(function(e) {
      return e.id
    }).join(',');
    
    var emails = arr.map(function(e) {
      return e.email
    }).join(',');
    console.log(ids, emails);
  });
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
  <tbody>
    <tr>
      <td><input id="1" type="checkbox" /></td>
      <td class="email">esha@gmail.com</td>
    </tr>
    <tr>
      <td><input id="2" type="checkbox" /></td>
      <td class="email">Nisha@gmail.com</td>
  </tbody>
</table>
<button type="button" id="saveAndSend">Send</button>

＆＃13;

另请注意，当您使用jQuery时，请使用不显眼的事件处理程序。

参考

Answer 2

它可能对你有所帮助。

function saveAndSend()
               {
                 var ele = $("tbody").find('input');
                 var saveInto=[]; 
                  $.each(ele, function( index, val ) {
                    if($(val).is(':checked')){
                      var id=$(val).attr('id');
                      var email=$(val).closest('tr').find('.email').text();
                      var temp={id:id,email:email};
                      saveInto.push(temp);
                    }
                      
                      
                  });
                  console.log(saveInto);
               }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
           <thead>
           </thead>
            <tbody>
              <tr>
               <td><input id="1" type="checkbox"/></td>     
                <td class="email">esha@gmail.com</td>
              </tr>
               <tr>
               <td><input id="2" type="checkbox"/></td>
                <td class="email">Nisha@gmail.com</td>
              </tr>
           </tbody>
        </table>
<input type="button" onclick="saveAndSend()" />

Answer 3

你可以用普通的javascript实现你的目标，这样就可以这样退出：

checkedEmails = []
chboxes = document.querySelectorAll('input[type="checkbox"]')
emails = document.querySelectorAll('.email')
checkedEmails = []

for (var i = 0; i < chboxes.length; i++)
{

    if (chboxes[i].checked)
        checkedEmails.push(emails[i].innerHTML)

}

然后您将在变量checkedEmails

中获得所需的电子邮件

Answer 4

  var studentList =[];
  var emailAddresses=[];
  $('table tr').each(function (i, row) {
  var tr =$(row);
  var chk= tr.find('input[type="checkbox"]').is(':checked')
  console.log(chk)
  if(chk){
      emailAddresses.push(tr.find('.email').text())
      studentList.push(tr.find('input[type="checkbox"]').prop('id'))
      console.log(emailAddresses);
      console.log(studentList);        
     }
  });

DEMO

如果选中复选框，如何从表中获取数据值？

4 个答案: