11

クライアント側の編集可能なテーブルを作成しようとしています。これが私のコードです。Chrome、Firefox では動作しますが、IE では動作しません。IE のスクリプトと関係があることはありますか?

<script type="text/javascript"       src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script>
$(document).ready(function() {

$("td").click(function(){
if($(this).attr("contentEditable") == true){
    $(this).attr("contentEditable","false");
} else {
    $(this).attr("contentEditable","true");
}
})
});
</script>

<p> 
<table id='transitTable' border="1" cellspacing="2" cellpadding="2" class='display'    width="400">
<tr id='1'>
<td >H1</td>
<td >H2</td>
<td >H3</td>
<td >H4</td></tr>
<tr id='2'>
<td >R1</td>
<td >R1</td>
<td >R1</td>
<td >R1</td></tr>
<tr id='3'>
<td >R2</td>
<td >R2</td>
<td >R2</td>
<td>R2</td></tr></table></p>
4

3 に答える 3

12

IE には、直接設定できない要素が多数ありますcontenteditable。ただし、全体tableを content editable にラップすることはできますdiv。

<div contenteditable="true">
    <table>
       ...
    </table>
</div>

これにより、テーブル内のすべてのセルが編集可能になります。ただし、一部のブラウザー (FF) では、テーブルの編集ハンドルが表示されるため、ビューが少し乱雑になります。

もう 1 つの可能性は、たとえば、編集可能なコンテンツspanまたはdiv各.xml に追加することtdです。

于 2013-08-22T15:02:29.807 に答える
6

IE はタグcontenteditable内の応答ではありません。td

あなたが試すことができます：

<td id="my-content" class="editable">
    <div contentEditable="true" style="width: 100%; height: 100%;">
        ...
    </div>
</td>
于 2016-05-18T09:11:45.927 に答える