无法从位于隐藏行单元格中的选择元素中获取 selectedIndex

我正在使用DataTable，我正在尝试使用位于表格单元格中的选择元素进行一些过滤功能。

筛选的工作原理是在位于每列下方的输入字段中输入文本。然后，filter函数检查该列的所有单元格中的选定文本，如果在一个单元格中找不到匹配项，则隐藏相关行。

加载表后，它可以过滤一次表。问题是在清除过滤器时，它不起作用。原因似乎与我将 selectedIndex 用于位于目前不可见的行中的选定 DOM 对象有关。

"qu_owner_xxx"是所选元素的 ID。

var el1 = document.getElementById("qu_owner_4");     //Visible, works like a charm
console.log("ID 1 " + el1.id);                       //ID is printed
console.log("EL 1 " + el1.selectedIndex);                           
var el2 = document.getElementById("qu_owner_17");    //Hidden, returns null
console.log("ID 2 " + el2.id);                       //Not reaching here
console.log("EL 2 " + el2.selectedIndex) ;           //Not reaching here
str = el.options[el.selectedIndex].text;             //Just for showing how to get the string used for filtering later 

问题是单元格的数据作为纯 html 而不是对象传递给过滤器函数。我可以从执行 $（aData[i2]）.attr（'id'） 的部分获取 id，其中 aData 是表行。但是使用jQuery与使用实际的DOM对象（例如selectedIndex）相比，似乎有一些信息是你无法访问的，特别是当你必须从html"重新创建"对象时。

如何从隐藏的选择框/行的选定值中获取文本？甚至可能吗？

更新

我在jsfiddle中测试了我的理论，但它实际上可以从隐藏的行/选择中检索信息。但毫无疑问，在我的过滤器功能中，未显示的行失败了。

我的筛选器函数（DataTable 在需要筛选时调用此函数）

$.fn.dataTableExt.afnFiltering.push(
                function( oSettings, aData, iDataIndex ) {
                var ret = true;    
                    //Loop through all input fields i tfoot that has class 'sl_filter' attached                                              
                   $('tfoot .sl_filter').each(function(i, obj){
                       //$(this) can be used. Get the index of this colum.
                       var i2 = $("tfoot input").index($(this));                           
                       //Create regexp to math
                       var r = new RegExp($(this).val(), "i");
                       var str = "";
                       if(i2 == 5){//This is just during development, don't want to care about other columns with select element so just doing things on this column
                            //Here I just pick two id, one that I know is visible and one that is not
                           var el1 = document.getElementById("qu_owner_4");     //Visible, works like a charm
                           console.log("ID 1 " + el1.id);                       //ID is printed
                           console.log("EL 1 " + el1.selectedIndex);            //selectedIndex is printed            
                           var el2 = document.getElementById("qu_owner_17");    //Hidden, returns null
                           console.log("ID 2 " + el2.id);                       //Not reaching here
                           console.log("EL 2 " + el2.selectedIndex) ;           //Not reaching here
                           //This is how I intended to get it working, but fail
                           var el = document.getElementById($(aData[i2]).attr('id'));                                                      
                           str = el.options[el.selectedIndex].text; //String to be used for comparing
                       }
                       /*Test to see if there is a match or if the input value is the default 
                         (the initial value of input before it has any fokus/text) */                           
                       if(r.test(str) || $(this).val()=="Search"){
                           //Return true only exits this function
                           return true;
                       }else{
                           /*Return false returns both function an .each. Retain 'false' in a variable scoped
                             to be reached outside the .each */                                
                           ret = false;
                           return false;
                       }
                   });
                   //Return true or false
                    return ret;                        
                }
            );

aData[x] 为我提供了该行上单元格 x 的单元格内容。对于选择元素，它是原始 html。

这 = 我输入的搜索字符串的输入字段。