如何獲取表格中的選定值

Question

這裏我使用表格。在這裏我要取兩個值：

1. 狀態
2. 狀態

---

下面第一行我選擇地位的兩個意味着我得到了正確的答案樣態是TN和狀態2，假設我選擇三種方式我會得到統計TN和狀態3，現在來到第二排現在我選擇狀態是兩個，但我得到的答案狀態是KAR（這是正確的），但狀態是1（這是錯誤的）

function checkbox(_this) { 
 
    alert($(_this).closest('tr').find('#state').text()); 
 
    var p_status = $('.status :selected').val(); 
 
    console.log(p_status); 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
    <table> 
 
    <tr> 
 
     <td id="idVal"> 1 </td> 
 
     <td id="state"> TN </td> 
 
     <td class="status"> 
 
     <!--<input type="checkbox" onchange="checkbox(this)"/>--> 
 
     <select class="form-control" onchange="checkbox(this);" style="width:150px;"> 
 
      <option value="1">one</option> 
 
      <option value="2">two</option> 
 
      <option value="3">three</option> 
 
     </select> 
 
     </td> 
 
    </tr> 
 
    
 
    <tr> 
 
     <td id="idVal"> 2 </td> 
 
     <td id="state"> KAR </td> 
 
     <td class="status"> 
 
     <!--<input type="checkbox" onchange="checkbox(this)"/>--> 
 
     <select class="form-control" onchange="checkbox(this);" style="width:150px;"> 
 
      <option value="1">one</option> 
 
      <option value="2">two</option> 
 
      <option value="3">three</option> 
 
     </select> 
 
     </td> 
 
    </tr> 
 
    </table>

Answer 1

我想你應該使用這一個：

function checkbox(_this){ 
    var p_state = $(_this).closest('tr').find('#state').text(); // get the text 
    var p_status = _this.value; // get the selected value 
    console.log(p_status); 
} 

在你的代碼的問題是一個jQuery類選擇返回找到的所有項目的列表。所以，你必須在this的選擇範圍內。

Answer 2

function checkbox(_this) 
 
\t { 
 
    alert($(_this).closest('tr').find('#state').text()); 
 
    var p_status = $('.state :selected').val(); 
 
    console.log(p_status); 
 
    } 
 

 

 
function checkbox_status(_this) 
 
\t { 
 
    alert($(_this).closest('tr').find('#status').text()); 
 
    var p_status = $('.status :selected').val(); 
 
    console.log(p_status); 
 
    }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<table> 
 

 
\t <tr> 
 
\t 
 
\t <td id="idVal"> 
 
\t 1 
 
\t </td> 
 
\t 
 
\t <td id="state"> 
 
     TN 
 
    </td> 
 
\t 
 
\t <td class="state"> 
 
    <!--<input type="checkbox" onchange="checkbox(this)"/>--> 
 
\t <select class="form-control" onchange="checkbox(this);" style="width:150px;"> 
 
\t \t <option value="1">one</option> 
 
\t \t <option value="2">two</option> 
 
\t \t <option value="3">three</option> 
 
\t </select> 
 
    </td> 
 
    </tr> 
 
    
 
    <tr> 
 
    <td id="idVal"> 
 
     2 
 
    </td> 
 
\t 
 
\t <td id="status"> 
 
     KAR 
 
    </td> 
 
\t 
 
\t <td class="status"> 
 
    <!--<input type="checkbox" onchange="checkbox_status(this)"/>--> 
 
\t <select class="form-control" onchange="checkbox_status(this);" style="width:150px;"> 
 
\t \t <option value="1">one</option> 
 
\t \t <option value="2">two</option> 
 
\t \t <option value="3">three</option> 
 
\t </select> 
 
    </td> 
 
\t 
 
    </tr> 
 
    </table>