-1

長さ4xMの画像のテーブルがあります:

<tr>
<td id='1'><div ...><img src=.../></div></td>
<td id='2'><div ...><img src=.../></div></td>
<td id='3'><div ...><img src=.../></div></td>
<td id='4'><div ...><img src=.../></div></td>
</tr>
<tr>
<td id='5'><div><img src=.../></div></td>
...

すべての画像で、タグonClick='RemoveImg(id);'を削除する必要があります。<td>

function RemoveImg(id)
{
$('#'+id).remove();
}

たとえば、id=3 の td を削除すると、html は次のようになります。

<tr>
<td id='1'><div ...><img src=.../></div></td>
<td id='2'><div ...><img src=.../></div></td>
<td id='4'><div ...><img src=.../></div></td>
</tr>
<tr>
<td id='5'><div><img src=.../></div></td>
...

どうすればid = 5でtdにすることができますか?下の行から上に移動して、このように見えます

  <tr>
<td id='1'><div ...><img src=.../></div></td>
<td id='2'><div ...><img src=.../></div></td>
<td id='4'><div ...><img src=.../></div></td>
<td id='5'><div ...><img src=.../></div></td>
</tr>
<tr>
...
4

3 に答える 3

3

テーブルの行を完全に取り除き、CSS を使用して、固定幅のコンテナー内で div を隣り合わせにフロートさせることができます。その後、それは自動的に起こります

<div id="container">
    <div id='1'><img src=.../></div>
    <div id='2'><img src=.../></div>
    <div id='3'><img src=.../></div>
    <div id='4'><img src=.../></div>
    <div id='5'><img src=.../></div>
</div>

付随する CSS を使用

#container {
    width: {fixed_width};
}

#container div {
    display: inline-block;
    float: left;
}
于 2013-05-01T17:37:48.790 に答える
0

あなたの質問を理解する方法は、あなたは常に4つのアイテムを続けて欲しいということです. 次の行から最初の td を移動する各行をループする必要があります。

または、ul/li を使用して各リスト項目をフローティングすることを検討することもできます。ul に幅を設定すると、li の子が削除または追加されたときに、li の子が自動的にラップされます。これは、コンテンツが大きい場合、フローティング要素でも機能します。例が欲しい場合はお知らせください。

于 2013-05-01T17:39:17.960 に答える
0

ここのコード サンプルは、1 行目から 3 列目を削除し、2 行目の 1 列目を 1 行目に追加します。

    function RemoveImg(columntoRemove, columntoAppend)
    {
      $('#'+columntoRemove).remove();
      var col5 = $("#" + columntoAppend).clone();
      $("#abctable tr:first").append(col5);
    };
于 2013-05-01T18:03:21.380 に答える