0
在html中我有一個空的表標記。問題與jQuery .append
<table cellpadding="5" cellspacing="5" border="0" id="TableID" class='TableOne'>
</table>
<input id="btn" value="test" type="button" />
在jscript函數中,我添加了一些初始行到表,其中之一包含另一個表。
$('#btn').click(function() {
var html = '';
html += "\
<tr>\
<td>Row1\
<table>\
<tr>\
<td></td>\
</tr>\
</table>\
</td>\
</tr>\
<tr>\
<td>Row2</td>\
</tr>";
$('#TableID').html(html);
var newhtml = "<tr><td>Row3</td></tr>";
$('#TableID').append(newhtml);
});
...
.tableOne
{
border: 3px solid black;
}
.tableTwo
{
border: 2px solid red;
}
當該代碼被執行的....而不是看到
ROW1 行2 ROW3
我們看到
ROW1 Row3 行2
第3行被放在內部表格內。不是我通過ID指定的表....如何解決這個問題?
編輯:
我不知道這樣做的原因實際上是,但我發現周圍的工作。
<table cellpadding="5" cellspacing="5" border="0" class='tableOne'>
<tbody id="TableID"></tbody>
</table>
<input id="btn" value="test" type="button" />
...
$('#btn').click(function() {
var html = '';
html += "\
<tr>\
<td>Row1\
<table>\
<tr>\
<td></td>\
</tr>\
</table>\
</td>\
</tr>\
<tr>\
<td>Row2</td>\
</tr>";
$('#TableID').html(html);
var newhtml = "<tr><td>Row3</td></tr>";
$('#TableID').append(newhtml);
});
..
http://jsfiddle.net/sjord010/U88fa/3/
您是否關閉了最初的'
'標籤? – 2011-04-26 22:45:45在jsFiddle中鞭打了這個:http://jsfiddle.net/JimmySawczuk/bPwMg/,這裏發生的是同樣的問題嗎?從我所看到的情況來看,這是預期的行爲。 – 2011-04-26 22:50:00
是的,我確實關閉了我的初始表格標籤。我的代碼實際上比這更復雜,這是一個非常簡化的版本。從未見過jsFiddle之前,好工具。但這就是應該發生的事情......不是我的實際代碼中發生的事情。我會看看我能做些什麼來發布一些實際的代碼 – Steph 2011-04-26 22:53:51
回答
去關中和意見的討論,我認爲
$.html
只是當你通過它在不喜歡格式不正確的HTML。無論如何,這裏是一個updated jsFiddle,我剛剛使用了$.append
並清理了一些空白。希望這可以幫助。爲了後代的緣故,下面是相關的JS代碼:來源
2011-04-27 01:11:17
啊!我明白了!很高興知道,以備將來參考。謝謝! – Steph 2011-04-27 14:38:26
試試看,而不是追加。
這answer還有這方面的更多信息。
Updated fiddle。
來源
2011-04-27 01:15:46
這對我來說並不合適,考慮到最後一個tr在技術上是包含在內部表格中的,所以真的會導致同樣的問題,我真的嘗試過這個。 – Steph 2011-04-27 14:32:05
相關問題