Question

当用户将鼠标悬停在图片$（“＃dot0003”）上时，我想用jquery的追加功能向我的网站添加一个表格。 Dreamweaver已经告诉我语法错误，但我不知道在哪里。

$(document).ready(function() {

$("#dot0003").hover(
    function(){

        $("#tablespace").append('

        <table  id="table1" class="info0004" border="4">
        <tr>
        <td>roomnumber</td>
        <td>200</td>
        </tr>
        <tr>
        <td>number of bathrooms</td>
        <td>2</td>
        </tr>
        <tr>
        <td>number of beds</td>
        <td><img src="_index/_dots/dot.gif" width="20" height="20"></td>
        </tr>
        </table>')

})
})

任何帮助表示赞赏！

Answer 1

你确定这是你要做的吗？这意味着，当您将鼠标悬停在dot0003上时，它会继续尝试附加此数据。请参阅此处的fiddle。

话虽如此，你的问题在于你的空间。看上面的小提琴。删除空格或构建字符串，如：

var myContent = '<table  id="table1" class="info0004" border="4">'
myContent += '<tr>'
...

但这会产生无效的HTML标记，因为您在表格中添加表格如下：

<table>
    <tr><td></td></tr>
    <table>
    ...

我认为你应该使用jQuery的after方法而不是append。

祝你好运。

Answer 2

Your adding dynamic table syntax has a space so remove space then run

您可以尝试使用简单的动态div

运行

$(document).ready(function() {

    $("#dot0003").hover(
        function(){
            $("#tablespace").append('<div>ss</div>')})})

但是当你用空格编写语法时，它会显示错误

$（document）.ready（function（）{

$("#dot0003").hover(
    function(){
        $("#tablespace").append('<div>ss

“）}）}）

删除额外空格后尝试使用此代码

$(document).ready(function() {

$("#dot0003").hover(
    function(){

        $("#tablespace").append('<table id="table1" class="info0004" border="4">       <tr><td>roomnumber</td><td>200</td></tr>        <tr><td>number of bathrooms</td>       <td>2</td></tr><tr><td>number of beds</td>        <td><img src="_index/_dots/dot.gif" width="20" height="20"></td></tr></table>')

})
})

.append（）不适用于表

2 个答案: