Question

我正在编写一个允许我搜索torrent网站的脚本。在页面加载时，左侧有一个要搜索的文本区域，右侧有一个空div。搜索使用AJAX拉取搜索结果表并附加到右侧的空/非空div。我想使用jQuery插件tablesorter对所述表进行排序。在后端，我逐行循环搜索POST，形成我的表，然后输出。下面是循环的内部：

$tables .= "<div align='right' style='border:solid 2px grey'>
<div class='subheader'>
    $file
    <input type='button' value='F This' onclick='toggleVis(\"$file.div\")'>
</div>
<div id='$file.div'>
    <table RULES=ROWS FRAME=HSIDES border='1' class='tablesorter' id='$file.table'>
        <thead>
            $headStr
        </thead>
        <tbody>
            $bodyStr
        </tbody>
    </table>

    <input type='button' value='F That--^' onclick='toggleVis(\"$file.div\")'>

</div>
</div>
<br>";

处理完所有数据后，我只是回显$表。下面是AJAX调用+ jquery初始化：

function doSearch(){
    var http;  
    try{
            // Opera 8.0+, Firefox, Safari
            http = new XMLHttpRequest();
    } catch (e){
            // Internet Exploder
            try{
                    http = new ActiveXObject("Msxml2.XMLHTTP");
            } catch (e) {
                    try{
                            http = new ActiveXObject("Microsoft.XMLHTTP");
                    } catch (e){
                            // Bad 
                            alert("Your browser derped!");
                            return false;
                    }
            }
    }

    http.onreadystatechange = function(){
        if(http.readyState == 4){
            if(document.getElementById('clearResults').checked)
                document.getElementById('searchResults').innerHTML = http.responseText;
            else
                document.getElementById('searchResults').innerHTML += http.responseText;

            $("table").tablesorter();  //  Initialize tablesorting
        }
    }
    search = encodeURIComponent(document.getElementById('search').value);
    document.getElementById('search').value = '';
    http.open("POST", "<?php echo $_SERVER['PHP_SELF']; ?>", true);
    http.setRequestHeader("Content-type", "application/x-www-form-urlencoded")
    http.send('lAct=search&search='+search);
}

所以上面的代码执行完美，但新表没有排序。有趣的是，初始化tablesorter实际上是将我的类更改为“标题” - 这意味着它正在工作？对于咯咯笑，我在页面上添加了一个静态表格;调用搜索函数后它会变为可排序（与更改的类一起）。有没有人碰到这样的事情？如有必要，我可以发布更多代码;任何帮助将不胜感激：D

以下是以下是正在输出的最终表：

<div id="ubuntu.div">
    <table rules="ROWS" frame="HSIDES" border="1" class="tablesorter" id="ubuntu.table">
        <thead>
            <tr><th class="header">Type</th><th class="header headerSortDown">Size</th><th class="header">SE</th><th class="header">LE</th><th class="header">name</th><th class="header">dl</th></tr>
        </thead>
        <tbody>
            <tr class="highlight" id="ubuntu.0"></tr><tr class="highlight" id="ubuntu.0"><td>Video(Other)</td><td><b>267.45MiB</b></td><td>7</td><td>1</td><td>VTC Ubuntu Certification</td><td>

    </td>
</tr><tr class="highlight" id="ubuntu.1"><td>Video(Other)</td><td><b>10.62MiB</b></td><td>1</td><td>1</td><td>Nelson Mandela explains Ubuntu (ideology)</td><td>

    </td>
</tr>
        </tbody>
    </table>

    <input type="button" value="F That--^" onclick="toggleVis(&quot;ubuntu.div&quot;)">

</div>

我还注意到，当我点击表格标题时，该类正在更改为包括SortDown或SortUp ...奇怪的是它没有排序......

Answer 1

有两行具有相同的ID，第一行是空的：

<tr class="highlight" id="ubuntu.0"></tr>
<tr class="highlight" id="ubuntu.0">...</tr>

通过AJAX接收的表上的jQuery表分类器

1 个答案: