jQuery : 선택한 라디오 버튼에 대한 부모 tr 가져 오기

jQuery : 선택한 라디오 버튼에 대한 부모 tr 가져 오기

---

다음 HTML이 있습니다.

<table id="MwDataList" class="data" width="100%" cellspacing="10px">
    ....

    <td class="centerText" style="height: 56px;">
        <input id="selectRadioButton" type="radio" name="selectRadioGroup">
    </td>

    ....
</table>

즉, 행이 거의없는 테이블이 있고 마지막 셀의 각 행에는 라디오 버튼이 있습니다. 선택한 라디오 버튼에 대한 상위 행을
어떻게 얻을 수 있습니까?

내가 시도한 것 :

function getSelectedRowGuid() {
    var row = $("#MwDataList > input:radio[@name=selectRadioGroup]:checked :parent tr");
    var guid = GetRowGuid(row);
    return guid;
}

그러나이 선택기가 잘못된 것 같습니다.

---

이 시도.

@jQuery 선택기에서 속성 이름을 접두사로 사용할 필요가 없습니다 . closest()메서드를 사용 하여 선택자와 가장 가까운 상위 요소를 가져옵니다.

$("#MwDataList input[name=selectRadioGroup]:checked").closest('tr');

다음과 같이 방법을 단순화 할 수 있습니다.

function getSelectedRowGuid() {
    return GetRowGuid(
      $("#MwDataList > input:radio[@name=selectRadioGroup]:checked :parent tr"));
}

closest() -현재 요소에서 시작하여 DOM 트리를 통해 진행하면서 선택기와 일치하는 첫 번째 요소를 가져옵니다.

참고로 요소의 ID는 페이지에서 고유해야하므로 마크 업에서 볼 수있는 라디오 버튼에 대해 동일한 ID를 사용하지 않도록하십시오. ID를 사용하지 않으려면 마크 업에서 제거하십시오.

---

대답

$("#MwDataList input[name=selectRadioGroup]:checked").closest('tr');

---

가장 가까운 행을 찾는 방법?

사용 .closest():

var $row = $(this).closest("tr");

---

사용 .parent():

이 .parent()방법을 확인하십시오 . 이것은 a .prev()및 .next().

var $row = $(this).parent()             // Moves up from <button> to <td>
                  .parent();            // Moves up from <td> to <tr>

---

모든 테이블 셀 가져 오기 <td>

var $row = $(this).closest("tr"),       // Finds the closest row <tr> 
    $tds = $row.find("td");             // Finds all children <td> elements

$.each($tds, function() {               // Visits every single <td> element
    console.log($(this).text());        // Prints out the text within the <td>
});

데모보기

---

구체적으로 만 <td>

var $row = $(this).closest("tr"),        // Finds the closest row <tr> 
    $tds = $row.find("td:nth-child(2)"); // Finds the 2nd <td> element

$.each($tds, function() {                // Visits every single <td> element
    console.log($(this).text());         // Prints out the text within the <td>
});

데모보기

---

유용한 방법

• .closest() -선택자와 일치하는 첫 번째 요소를 가져옵니다.
• .parent() -현재 일치하는 요소 집합에서 각 요소의 부모를 가져옵니다.
• .parents() -현재 일치하는 요소 집합에서 각 요소의 조상을 가져옵니다.
• .children() -일치하는 요소 집합에서 각 요소의 자식을 가져옵니다.
• .siblings() -일치하는 요소 집합에서 각 요소의 형제를 가져옵니다.
• .find() -현재 일치하는 요소 집합에서 각 요소의 하위 항목을 가져옵니다.
• .next() - get the immediately following sibling of each element in the set of matched elements
• .prev() - get the immediately preceding sibling of each element in the set of matched elements

참고URL : https://stackoverflow.com/questions/9314902/jquery-get-parent-tr-for-selected-radio-button