2

首先，大家好，因为我是新来的。

为了总结我的问题，我读取了一个 XML 文件的内容以显示在一个表格中。执行此操作的基本函数效果很好，我创建了一个派生函数来包含与输入字段相关的搜索过滤器。搜索算法运行良好，我可以使用 alert() 函数预览搜索结果的 HTML 代码，并且该代码看起来很合适，可以按预期正确显示在浏览器中。但是，相关 div 的 innerHTML 代码没有更新......我将不胜感激任何人可以提供的任何类型的输入或解决方案，因为我一直坚持这一点！谢谢 ！

这是代码：

    function printListMod2(){
    //Search parameters ?
    var searchContent = document.getElementById("searchField").value;
    var i=0;

    newHTML = "<table id=\"tableInstrus\">";
    for (i=0;i<listInstrus.length;i++){
        filename = returnFilename(i);
        title = returnTitle(i);
        tempo = returnTempo(i);
        sample = returnSample(i);
        multi = returnMulti(i);
        style1 = returnStyle1(i);
        style2 = returnStyle2(i);

        var regEx = new RegExp(searchContent, 'gi');
        var resultSearch = title.match(regEx);
        if(resultSearch!=null){
            if(i%2==0){
                newHTML += "<tr class=\"tr0\"><td class=\"idColumn\">"+(i+1)+"</td><td class=\"emptyColumn\"></td><td class=\"nameColumn\">"+title+"</td><td class=\"tempoColumn\">"+tempo+"</td><td class=\"sampleColumn\">"+sample+"</td><td class=\"multiColumn\">"+multi+"</td><td class=\"styleColumn\">"+style1+"</td><td class=\"styleColumn\">"+style2+"</td><td class=\"addLink\"><a id="+filename+" onclick=\"addLinkToPlaylist("+i+")\"><img title=\"Add to playlist\" class=\"addButton\" src=\"images/buttonAdd.png\"/></a></td><td class=\"playLink\"><a onclick=\"playTrack("+i+","+true+")\"><img title=\"Play this track\" class=\"playButton\" src=\"images/buttonPlaySmall.png\"/></a></td></tr>";
            }
            else{
                newHTML += "<tr class=\"tr1\"><td class=\"idColumn\">"+(i+1)+"</td><td class=\"emptyColumn\"></td><td class=\"nameColumn\">"+title+"</td><td class=\"tempoColumn\">"+tempo+"</td><td class=\"sampleColumn\">"+sample+"</td><td class=\"multiColumn\">"+multi+"</td><td class=\"styleColumn\">"+style1+"</td><td class=\"styleColumn\">"+style2+"</td><td class=\"addLink\"><a id="+filename+" onclick=\"addLinkToPlaylist("+i+")\"><img title=\"Add to playlist\" class=\"addButton\" src=\"images/buttonAdd.png\"/></a></td><td class=\"playLink\"><a onclick=\"playTrack("+i+","+true+")\"><img title=\"Play this track\" class=\"playButton\" src=\"images/buttonPlaySmall.png\"/></a></td></tr>";
            }
        }
    }
    newHTML += "<tr><td class=\"idColumn\"></td><td id=\"emptyColumn\"></td><td class=\"nameColumn\"></td><td class=\"tempoColumn\"></td><td class=\"sampleColumn\"></td><td class=\"multiColumn\"></td><td></td><td></td></tr>";
    newHTML += "</table>";
    alert(newHTML); //this displays the HTML code properly
    document.getElementById("listDiv").innerHTML = newHTML; //this doesn't seem to do anything...
}
4

1 回答 1

0

您的脚本是在文档完成加载之前执行的吗？然后它不会找到 #listDiv 因为 div 还不存在。

我会检查 javascript 控制台输出是否有错误，并检查以下代码是否未返回未定义：

{
  ...
  console.log( document.getElementById('listDiv') );
}
于 2013-08-02T16:50:07.760 回答