0

ユーザーが写真をアップロードできるようにするためにこれを持っています。写真の数を 4 つに制限したかったのです。最初は入力フィールドが 1 つしか表示されていません。ユーザーがさらに追加したい場合は、Button-Add-icon.png をクリックすると、別の入力フィールドが表示されます。4 つの入力に達し、1 つを削除することに決めたら、Button-Delete-icon.png をクリックします。

この全体は、Firefox、Chrome、Seamonkey、および IE9 で正常に動作します。ただし、IE8、IE7 以前では動作しません。誰かがそれを修正する方法についてヒントを与えることができますか?

ありがとう

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org 
 /TR/xhtml1/DTD/xhtml1-transitional.dtd">
 <html xmlns="http://www.w3.org/1999/xhtml">
 <head>
 <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
 <title>Document sans titre</title>

 <script type="text/javascript">
   var totalItems = 0;
   function addItems()
 {
   if(totalItems < 3) 
  {
  var table1 = document.getElementById('tab1');
  var newrow = document.createElement("tr");
  var newcol = document.createElement("td");
  var input = document.createElement("input");
  input.type="file";
  input.name="image[]";
  newcol.appendChild(input);
  newrow.appendChild(newcol);
  table1.appendChild(newrow);
  totalItems++;
  } else {
    //Display your message here.. 
         }
 }


  function remItems()
{
var table1 = document.getElementById('tab1');
var lastRow = table1.rows.length;
if(lastRow>=2) 
 {
 table1.deleteRow(lastRow-1);
 totalItems--; 
 }
}

 </script>
 </head>

 <body>

 <table align="center" border="0" id="tab1" >
  <tr>
   <td width="218" align="center"><input type="file" name="image[]" /></td>
      <td width="54" align="center"><img src="images/Button-Add-icon.png"  
      style="cursor:pointer" onclick="addItems()" />
      </td>
   <td><img src="images/Button-Delete-icon.png"  style="cursor:pointer" 
    onclick="remItems()" />
   </td>
  </tr>
 </table>

  <table align="center" border="0" id="tab2">
  </table>

 </body>
 </html>
4

1 に答える 1

1

行を子として間違った要素に追加しています。

HTML テーブルには常にtbody子要素として要素trがあり、すべての要素はこの中に入ります。要素のないテーブルを含む HTML を記述すると、テーブルはtbody自動的に作成されますが、後でテーブルを変更するときはtbody要素を考慮する必要があります。

簡単な修正は、tbody要素を明示的に記述し、ID を与え、tbody要素ではなく要素に新しい行を挿入することtableです。

<table>
    <tbody id="tb1">
        <tr><td></td></tr>
    </tbody>
</table>
于 2013-03-19T21:55:01.273 に答える