Question

我有一个表格，其中填充了AJAX onchange请求的结果。一切都很完美，但我也有一个包含在windows.load上的JS脚本，它根据鼠标悬停，鼠标输出，onclick等更改表格。但是，由于表格没有填充，直到AJAX请求表格JS功能做不行。有没有办法用AJAX请求填充表，而不是做window.load，在AJAX请求完成期间或之后加载JS脚本？以下是我的代码：

<link href="<?php echo $this->config->item('base_url'); ?>/css/table_design.css" 
      rel="stylesheet" type="text/css" media="screen" />

// This is the script that is included, and inside the script
//the main function is started by window.load
<script type="text/javascript" 
    src="<?php echo $this->config->item('base_url'); ?>/js/table_design.js"></script>

<br />

<script type="text/javascript">
    function showUser(str) {
        if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari
            xmlhttp=new XMLHttpRequest();
        }
        else {// code for IE6, IE5
            xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
        }
        xmlhttp.onreadystatechange=function()   {
            if (xmlhttp.readyState==4 && xmlhttp.status==200)   {
                document.getElementById("tars").innerHTML=xmlhttp.responseText;
            }
        }
        xmlhttp.open("GET","jqueryDB/catSelector?cat="+str,true);
        xmlhttp.send();
}
</script>

这是我通过AJAX请求的PHP页面：

public function catSelector()
{
    $catID = $_GET['cat'];  
    $query = $this->db->query('SELECT * FROM upload WHERE category = '.$catID);
    $num_rows = $query->num_rows();
    $val = $query->result_array();   

    echo '<table cellspacing="0" cellpadding="0">
        <tr>
        <th width="50%">File Name:</th>
        <th width="30%">File Size:</th>
        <th>Download Link:</th>
    </tr>';

    $c = true;
    foreach($val as $files){

         if ($files['size'] >= 1000000000) {
             $files['size'] = round( ($files['size'] / 1000000000) , 2).' GB';
        }

        if ($files['size'] >= 1000000) {
            $files['size'] = round( ($files['size'] / 1000000) , 2).' MB';
        }else{
            $files['size'] = round( ($files['size'] / 1000) , 2).' KB';
        }

        echo '<tr'.(($c = !$c)?' class="odd"':'').">
            <td>$files[name]</td>
            <td>$files[size]</td>
            <td><a href='$files[location]' >Download</a></td>
        </tr>";
    }

    echo '</table>';
}

Answer 1

我从未使用XMLHttpRequest，但在阅读后我认为你可以这样做：

function showUser(str)  {
    ...
    xmlhttp.open("GET","jqueryDB/catSelector?cat=" + str, true);
    xmlhttp.onload = function() { //add click events to table elements (same function you calling now with `window.load` };
    xmlhttp.send();
}

Answer 2

你能发送你在窗口加载时执行的js脚本吗？也尝试调用脚本，如下所示： -

xmlhttp.onreadystatechange=function()  
                      if (xmlhttp.readyState==4 && xmlhttp.status==200)
                        document.getElementById("tars").innerHTML=xmlhttp.responseText;
// call the js script here example test();

Ajax请求正在取消页面上的其他JS事件

2 个答案: