如何獲取屬於已選中單選按鈕的td的文本

Question

我正在嘗試獲取屬於選中的單選按鈕的td文本，但是我不能，並且我的代碼無法正常工作：

  <tr>
    <td><input name="radio_org_id" type="radio"></td>  
        <td>male</td>                                                        
     </tr>

$("body").on("change", "input[name='radio_org_id']:radio:checked", function () {
$('input[name="radio_org_id"]:radio:checked').each(function () {
    var vIns_title = $(this).next().find('td').text()
    alert(vIns_title)
});

Answer 1

使用$(this).parent().next("td").text()

 $("body").on("change", "input[name='radio_org_id']:radio:checked", function() { $('input[name="radio_org_id"]:radio:checked').each(function() { var vIns_title = $(this).parent().next("td").text() alert(vIns_title) }); }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <table> <tr> <td><input name="radio_org_id" type="radio"></td> <td>male</td> </tr> <tr> <td><input name="radio_org_id" type="radio"></td> <td>female</td> </tr> </table> 

Answer 2

嘗試將此$(this).closest('td').next('td').text()文檔用於closest() 。 而且您的點擊功能選擇器是錯誤的。因此請像"input[name='radio_org_id']"一樣進行更改

 $("body").on("change", "input[name='radio_org_id']", function() { $('input[name="radio_org_id"]:checked').each(function() { var vIns_title = $(this).closest('td').next('td').text() console.log(vIns_title) }); }) 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <table> <tr> <td><input name="radio_org_id" type="radio"></td> <td>male</td> </tr> <table> 

Answer 3

您的初始選擇器存在缺陷，因為您僅選擇已checked元素。 :radio也是多余的。

要解決您的問題，請使用closest().next()獲取同級td元素。 嘗試這個：

 $('table').on("change", "input[name='radio_org_id']", function() { if ($(this).is(':checked')) { var vIns_title = $(this).closest('td').next('td').text() console.log(vIns_title) } }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <table> <tr> <td><input name="radio_org_id" type="radio"></td> <td>male</td> </tr> <tr> <td><input name="radio_org_id" type="radio"></td> <td>female</td> </tr> </table> 

您還應該注意，可以通過在單選輸入上放置一個value並在JS代碼中讀出該value來簡化此操作。