如何在jQuery中獲取嵌套元素

當天早些時候，我陷入了與jquery'sfind方法工作。現在我無法從我的HTML見下表獲取嵌套的元素：如何在jQuery中獲取嵌套元素

什麼，我試圖做的：在每個複選框選中的列即select，我想的兄弟姐妹，即name和address打印值但我無法做到這一點。下面是我的代碼：

$("#but").click(function(){ 
     $(".tabclass tr td input[type='checkbox']:checked").each(function(){ 
      var sibs=$(this).siblings("td"); 
      var v1=$(sibs[0]).text(); 
      var v2=$(sibs[1]).children[0].val(); 
      alert(v1+" & "+v2); 
     }); 
});

HTML代碼：

<body> 
    <table border="1" class="tabclass"> 
    <th>select</th> 
    <th>Name</th> 
    <th>Address</th> 
    <tr> 
     <td> 
     <input type="checkbox" name="selectCheck" class="select" id="ch1" value="1" /> </td> 
     <td><span class="name">Nitin</span></td> 
     <td> 
     <select name="address"> 
      <option>Gurgaon</option> 
      <option>Noida</option> 
      <option>Rohini</option> 
     </select> 
     </td> 
    </tr> 
    <tr> 
     <td> 
     <input type="checkbox" name="selectCheck" class="select" id="ch2" value="2" /> </td> 
     <td><span class="name">Abc</span></td> 
     <td> 
     <select name="address"> 
      <option>Gurgaon</option> 
      <option>Noida</option> 
      <option>Rohini</option> 
     </select> 
     </td> 
    </tr> 
    <tr> 
     <td> 
     <input type="checkbox" name="selectCheck" class="select" id="ch3" value="3" /> </td> 
     <td><span class="name">Xyz</span></td> 
     <td> 
     <select name="address"> 
      <option>Gurgaon</option> 
      <option>Noida</option> 
      <option>Rohini</option> 
     </select> 
     </td> 
    </tr> 
    </table> 
    <br> 
    <br> 
    <button id="but">Test</button> 
</body>

來源

2016-12-10 JPG

你有2個問題的代碼

你讓他們的兄弟姐妹之前需要檢查輸入的父母。

變化

var sibs=$(this).siblings("td");

到

var sibs=$(this).parent().siblings("td");

.children[0]給你一個DOM對象，它不具有val()方法。

替換

var v2=$(sibs[1]).children[0].val();

與

var v2 = $('select', sibs[1]).val(); OR var v2=$(sibs[1]).children()[0].value;

還可以使用console.log代替alert因爲後者停止在其上運行的UI線程。

$("#but").click(function() { 
    $(".tabclass tr td input[type='checkbox']:checked").each(function() { 
    var sibs = $(this).parent().siblings("td"); 
    var v1 = $(sibs[0]).text(); 
    var v2 = $('select', sibs[1]).val(); 
    alert(v1 + " & " + v2); 
    }); 
});

Check Fiddle

來源

2016-12-10 01:29:31

你在一個偉大的方式解釋它，非常感謝。 – JPG

@JSK很高興幫助:) –

問題：是的複選框的td孩子，它沒有任何兄弟姐妹。按照您的代碼var sibs=$(this).siblings("td");，它不會提取任何內容。

解決方案：是去其上一級，即：td和現在這td有兄弟姐妹。因此，使用此代碼

var sibs=$(this).parent().siblings("td");

而且改變$(sibs[1]).children[0].val();

要

$(sibs[1]).children('select').val();

來源

2016-12-10 01:33:37

如何在jQuery中獲取嵌套元素

回答

相關問題