2014-11-05 87 views
0

我有HTML,跨度内2jQuery的查找功能不能正常工作

<select> ... </select> 

元素与类spanClass。我现在想选择使用jQuery的选择与此代码:

jQuery(document).ready(function() { 
    spans = jQuery('.spanClass'); 
    spans.each(function() { 

     var inputs = jQuery(this).find('select'); 
     console.log(inputs);// This is working 
     inputs.each(function() { 
      alert('test'); //This not 
     }); 
    }); 
}); 

HTML:

<table> 
<tr> 
    <td> 
     <select name="een"> 
      <option> test </option> 
     </select> 
    </td> 
</tr> 

     <select name="twee"> 
      <option> test </option> 
     </select> 
    </td> 
</tr> 
</table> 

但是,这是行不通的,任何人可以告诉我为什么?

+2

它看起来很好 - 你可以分享的HTML样品 – 2014-11-05 03:01:47

+3

您有不正确的DOM。你没有在tr和td元素中正确包装第二个选择。对于你所提到的你也很好。 http://jsfiddle.net/ca8st4oz/ – 2014-11-05 03:06:23

+1

我不认为跨度(内联元素)应该包含表格(块元素)。根据文档类型的不同,该表格可能会在其应有范围容器外部构建。事实上,某人有这个HTML工作在一个小提琴并不意味着它会在所有浏览器中的所有文档类型下工作。 – 2014-11-05 03:24:23

回答

1

首先>认沽表(它是这样做的正确方法)

二>纠正你的table标签如下面的图像和代码(其中有些是不正确的!)

现在>使用这些代码

HTML:

<div class="divClass"> 
<table> 
    <tr> 
     <td> 
      <select name="een"> 
       <option> test </option> 
      </select> 
     </td> 
    </tr> 
    <tr> 
     <td> 
      <select name="twee"> 
       <option> test </option> 
      </select> 
     </td> 
    </tr> 
</table> 
</div> 

的jQuery:

jQuery(document).ready(function() { 
    spans = jQuery('.divClass'); 
    spans.each(function() { 

     var inputs = jQuery(this).find('select'); 
     console.log(inputs); 
     inputs.each(function() { 
      console.log(jQuery(this).prop("name")); 
     }); 
    }); 
}); 

结果:

enter image description here

0
var inputs = jQuery(this).find('select'); // Isn't inputs empty jQueryObject? length 0? 

如果输入为空jQueryObject,不会调用.each()传递的回调函数。里面的div代替跨度