获取所选行的最接近输入值

时间:2018-05-08 06:14:10

标签: jquery html

我有一行复选框。我想获得选中的行价和货币值.price是一个文本框,货币是一个选择框。



$(document).ready(function() {
  $('#test').click(function(){
    $("#select_update:checked").each(function() { 
       console.log($(this).attr('data-id'));
       console.log($(this).closest('input').attr('data-price'));
       console.log($(this).closest('select').attr('data-currency'));
    });
 });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<tr role="row">
										   
  <td><input id="select_update" data-id="13" name="select_update" type="checkbox"></td>		<td class="request-edit viewPopLink" id="app-rej" data-id="1819AM0012" data-toggle="modal" data-backdrop="static" data-keyboard="false" data-target="#myModal"><a>1819AM0012</a></td>
		<td>abhijit.biswas</td>
		<td class="fixed_width" title="Testing(SL)">Testing(SL)</td>
		<td class="fixed_width" title="test customer">test customer</td>
		<td class="fixed_width" title="AAtest115">AAtest115</td>
		<td><input id="price" class="default used_asset1" maxlength="8" placeholder="Amount" data-price="342" name="price" type="text" value="342"></td><td><select class="currency_type" data-currency="5" name="currency"><option value="">Select</option><option value="6">AED</option><option value="5" selected="selected">AUD</option><option value="7">CAD</option><option value="9">EUR</option><option value="3">GBP</option><option value="1">INR</option><option value="8">KWD</option><option value="11">PHP</option><option value="10">SAR</option><option value="12">SEK</option><option value="4">SGD</option><option value="2">USD</option></select></td>		<td>Hardware</td>
		<td>
		    			  Laptop
		  		</td>
		<td class="fixed_width"></td>
		<td>3</td>
		<td>China</td>
		<td class="request-edit viewPopLink" id="app-rej" data-id="1819AM0012" data-toggle="modal" data-backdrop="static" data-keyboard="false" data-target="#myModal"><a>Waiting for Review</a></td>			
		</tr>
    <input type="button" value="click me" id="test">
&#13;
&#13;
&#13;

2 个答案:

答案 0 :(得分:2)

修改:添加了<table><tbody>并修复了该功能。

请改用siblings()

closest()是找到与选择器匹配的最近的祖先节点。

$(document).ready(function() {
  $('#test').click(function() {
    $("#select_update:checked").each(function() {
      console.log($(this).attr('data-id'));
      let $td = $(this).parent()
      console.log($td.siblings().find('input').attr('data-price'));
      console.log($td.siblings().find('select').attr('data-currency'));
    });
  });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<table>
  <tbody>
    <tr role="row">
      <td><input id="select_update" data-id="13" name="select_update" type="checkbox"></td>
      <td class="request-edit viewPopLink" id="app-rej" data-id="1819AM0012" data-toggle="modal" data-backdrop="static" data-keyboard="false" data-target="#myModal"><a>1819AM0012</a></td>
      <td>abhijit.biswas</td>
      <td class="fixed_width" title="Testing(SL)">Testing(SL)</td>
      <td class="fixed_width" title="test customer">test customer</td>
      <td class="fixed_width" title="AAtest115">AAtest115</td>
      <td><input id="price" class="default used_asset1" maxlength="8" placeholder="Amount" data-price="342" name="price" type="text" value="342"></td>
      <td>
        <select class="currency_type" data-currency="5" name="currency">
          <option value="">Select</option>
          <option value="6">AED</option>
          <option value="5" selected="selected">AUD</option>
          <option value="7">CAD</option>
          <option value="9">EUR</option>
          <option value="3">GBP</option>
          <option value="1">INR</option>
          <option value="8">KWD</option>
          <option value="11">PHP</option>
          <option value="10">SAR</option>
          <option value="12">SEK</option>
          <option value="4">SGD</option>
          <option value="2">USD</option>
        </select>
      </td>
      <td>Hardware</td>
      <td>
        Laptop
      </td>
      <td class="fixed_width"></td>
      <td>3</td>
      <td>China</td>
      <td class="request-edit viewPopLink" id="app-rej" data-id="1819AM0012" data-toggle="modal" data-backdrop="static" data-keyboard="false" data-target="#myModal"><a>Waiting for Review</a></td>
    </tr>

  </tbody>
</table>
<input type="button" value="click me" id="test">

答案 1 :(得分:1)

&#13;
&#13;
$(document).ready(function() {
  $('#test').click(function(){
  
    $("#select_update:checked").each(function() { 
       console.log($(this).attr('data-id'));
      console.log( $(this).parent('td').siblings('td:eq(5)').find('input').attr('data-price'));
       
       console.log(
        $(this).parent('td').siblings('td:eq(6)').find('select option:selected').text());
    });
 });
});
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
<tbody>
<tr role="row">
										   
  <td><input id="select_update" data-id="13" name="select_update" type="checkbox"></td>		<td class="request-edit viewPopLink" id="app-rej" data-id="1819AM0012" data-toggle="modal" data-backdrop="static" data-keyboard="false" data-target="#myModal"><a>1819AM0012</a></td>
		<td>abhijit.biswas</td>
		<td class="fixed_width" title="Testing(SL)">Testing(SL)</td>
		<td class="fixed_width" title="test customer">test customer</td>
		<td class="fixed_width" title="AAtest115">AAtest115</td>
		<td><input id="price" class="default used_asset1" maxlength="8" placeholder="Amount" data-price="342" name="price" type="text" value="342"></td><td><select class="currency_type" data-currency="5" name="currency"><option value="">Select</option><option value="6">AED</option><option value="5" selected="selected">AUD</option><option value="7">CAD</option><option value="9">EUR</option><option value="3">GBP</option><option value="1">INR</option><option value="8">KWD</option><option value="11">PHP</option><option value="10">SAR</option><option value="12">SEK</option><option value="4">SGD</option><option value="2">USD</option></select></td>		<td>Hardware</td>
		<td>
		    			  Laptop
		  		</td>
		<td class="fixed_width"></td>
		<td>3</td>
		<td>China</td>
		<td class="request-edit viewPopLink" id="app-rej" data-id="1819AM0012" data-toggle="modal" data-backdrop="static" data-keyboard="false" data-target="#myModal"><a>Waiting for Review</a></td>			
		</tr>
    </tbody>
</table>
<input type="button" value="click me" id="test">
&#13;
&#13;
&#13;

我希望它可以帮到你。发现自己做错了什么。