テーブル内の要素のsrc、height、およびwidthを設定するためのfor（）ループがあります。私はJavascriptにかなり慣れていませんが（約2〜3週間、独学）、ゲームSecond Lifeでラインスクリプト言語（LSL）でコーディングしたので、これはかなり馴染みがあり、理解しやすいようです。 。これは、これを機能させるための私のコードと他のコードの組み合わせでもあります。「film1.txt」ファイルを読むなどの大きな部分は、誰かからのものであり、私のために機能するように大幅に変更されました。ほとんどすべての変数には、私が行ったときに思いついた名前が付いているので、少し恣意的に見えるかもしれません。
問題の原因となるJavascript：
var txtFile = new XMLHttpRequest();
txtFile.open("GET", "film1.txt", true);
txtFile.onreadystatechange = function() {
if (txtFile.readyState === 4) { // Makes sure the document is ready to parse.
if (txtFile.status === 200) { // Makes sure it's found the file.
allText = txtFile.responseText;
linesParted = allText.split(","); // Will separate each line into an array
document.getElementById("display").src=linesParted[0];
document.getElementById("displayText").innerHTML=linesParted[1];
var dispResize = new Image();
dispResize.src = linesParted[0];
dispResize.onload = function() {
var dispNewHeight = (this.height*(500))/this.width;
var dispNewWidth = 500;
document.getElementById("display").style.height = dispNewHeight;
document.getElementById("display").style.width = dispNewWidth;
}
//
var imgToDo;
for(imgToDo = 0; imgToDo < ((linesParted.length)/2); imgToDo++)
{
var imgToResize = new Image();
imgToDoTimes2 = linesParted[imgToDo*2]
if(imgToDoTimes2 != null) {
document.getElementById("img"+imgToDo).style.cursor = "pointer";
document.getElementById("img"+imgToDo).src=imgToDoTimes2;
imgToResize.src = imgToDoTimes2;
imgToResize.onload = function() {
var imgResizeNewHeight = (this.height*125)/this.width;
document.getElementById("img"+imgToDo).height = imgResizeNewHeight;
document.getElementById("img"+imgToDo).width = 125;
}
}
}
}
}
}
txtFile.send(null);
Javascriptの影響を受けるHTML
<table border="0" align="center" cellpadding="0" cellspacing="0" id="displayTable">
<tr><td colspan="10"><center><div id="displayText"></div></center></td></tr>
<tr><td colspan="10" align="center"><img src="" id="display" onClick="scaleDisplay()" ondblclick="dblClick('display')" /></td></tr>
<tr><td></td><td colspan="6"><hr /></td><td></td></tr>
<tr width="500" id="imgRow">
<td></td>
<td onclick="fullsize(0)" width="125" ondblclick="dblClick(0)"><img src="" width="125" id="img0"/></td>
<td onclick="fullsize(1)" width="125" ondblclick="dblClick(1)"><img src="" width="125" id="img1"/></td>
<td onclick="fullsize(2)" width="125" ondblclick="dblClick(2)"><img src="" width="125" id="img2"/></td>
<td onclick="fullsize(3)" width="125" ondblclick="dblClick(3)"><img src="" width="125" id="img3"/></td>
<td onclick="fullsize(4)" width="125" ondblclick="dblClick(4)"><img src="" width="125" id="img4"/></td>
<td onclick="fullsize(5)" width="125" ondblclick="dblClick(5)"><img src="" width="125" id="img5"/></td>
<td></td>
</tr>
<tr width="500" id="imgRow">
<td></td>
<td onclick="fullsize(6)" width="125" ondblclick="dblClick(6)"><img src="" width="125" id="img6"/></td>
<td onclick="fullsize(7)" width="125" ondblclick="dblClick(7)"><img src="" width="125" id="img7"/></td>
<td onclick="fullsize(8)" width="125" ondblclick="dblClick(8)"><img src="" width="125" id="img8"/></td>
<td onclick="fullsize(9)" width="125" ondblclick="dblClick(9)"><img src="" width="125" id="img9"/></td>
<td onclick="fullsize(10)" width="125" ondblclick="dblClick(10)"><img src="" width="125" id="img10"/></td>
<td onclick="fullsize(11)" width="125" ondblclick="dblClick(11)"><img src="" width="125" id="img11"/></td>
<td></td>
</tr>
<tr width="500" id="imgRow">
<td></td>
<td onclick="fullsize(12)" width="125" ondblclick="dblClick(12)"><img src="" width="125" id="img12"/></td>
<td onclick="fullsize(13)" width="125" ondblclick="dblClick(13)"><img src="" width="125" id="img13"/></td>
<td onclick="fullsize(14)" width="125" ondblclick="dblClick(14)"><img src="" width="125" id="img14"/></td>
<td onclick="fullsize(15)" width="125" ondblclick="dblClick(15)"><img src="" width="125" id="img15"/></td>
<td onclick="fullsize(16)" width="125" ondblclick="dblClick(16)"><img src="" width="125" id="img16"/></td>
<td onclick="fullsize(17)" width="125" ondblclick="dblClick(17)"><img src="" width="125" id="img17"/></td>
<td></td>
</tr>
<tr width="500" id="imgRow">
<td></td>
<td onclick="fullsize(18)" width="125" ondblclick="dblClick(18)"><img src="" width="125" id="img18"/></td>
<td onclick="fullsize(19)" width="125" ondblclick="dblClick(19)"><img src="" width="125" id="img19"/></td>
<td onclick="fullsize(20)" width="125" ondblclick="dblClick(20)"><img src="" width="125" id="img20"/></td>
<td onclick="fullsize(21)" width="125" ondblclick="dblClick(21)"><img src="" width="125" id="img21"/></td>
<td onclick="fullsize(22)" width="125" ondblclick="dblClick(22)"><img src="" width="125" id="img22"/></td>
<td onclick="fullsize(23)" width="125" ondblclick="dblClick(23)"><img src="" width="125" id="img23"/></td>
<td></td>
</tr>
<tr><td colspan="6" height="25"> </td></tr>
</table>
コードの説明：film1.txtというサーバー上のファイルから提供された配列内のアイテムのリストを提供します（フィルムストリップタイプのもののように..しかし、気が変わった）。次のようになります： "filedir / filename.jpg、File Title、filedir / filename.jpg、File Title、filedir / filename.jpg、FileTitle"。これは、「linesParted[]」で呼び出される配列への.split（）です。for（）ループは、0から開始し、<（lineParted.length）/2でなくなるまで実行します。新しいImage（）を作成し、for（）ループでテストされた変数の変数をlinesParted []で2倍にし、その新しい変数が！=からnullであるかどうかをif（）でテストします。そうでない場合は、'sstyle.cursorを"pointer"に設定し、のsrcを設定し、Image（）のsrcをimgToDoTimes2に設定し、それが読み込まれると、
問題：何らかの理由で、film1.txtからのソースデータがないため、何もできない最後の値をnullに設定しますが、バウンディングボックスのようなものを残します。 nullではなかった最後の画像。
これは、エラーが発生したサーバー上の上記のコードの完全版です。注：3（通常は一番上のindex.htmlにあります）に注意してください：http：//greengoosemarketing.com/so/
他のリソースリンクは、そのページのメモにあります。
それが置かれているサイトに関する一言：このサイトは私の高度なアニメーションの先生のものです。そこに掲載されている作品は主に学生作品です。「MinecraftC4DRender」は私がそこで取り組んでいる唯一の作品です。：3
他に提供できるものがあれば教えてください。