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

ドキュメントの読み込みが完了する前にスクリプトが実行されていませんか? div がまだ存在しないため、#listDiv は見つかりません。

javascript コンソールの出力でエラーを確認し、次のコードが undefined を返さないかどうかを確認します。

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