Question

所以我正在构建这个功能，动态输出一个新的＆＃34;面板＆＃34; （某些HTML）。然而，问题是新创建的div缺少id，尽管我明确指定了一个。 id应该是一个带有数字的名称，该数字在每一代新div（name1，name2等）上递增。但我不能让div接受我分配它的id。

//add panel
  var i = 1; 
        $('#panel').click(function() { 
        $('body').append("<div id='photoContent" + i + "'><h1> Panel </h1><div id='showTable'><h2>add image</h2><div id='table'></div></div></div>").css({
            'margin' : '0px', 
            'padding' : '0px',
            'height' : height, 
            'width' : width,
            'background-color' : 'yellow', 
            'color' : 'rgba(192, 192, 192, .9)',
            'font-family' : 'sans-serif', 
            'font-size' : '40px',
            'text-align' : 'center',
            'border' : '2px solid rgba(192, 192, 192, 1)',
            'border-left-style' : 'none',
            'border-right-style' : 'none'
        }); //close css object literal; 
i++; }); //end click function

任何帮助都将不胜感激。

Answer 1

您的代码中有错误。

如果您删除此注释代码：

//some css

哪个在

之内

.css ({//some css});

这是一个有效的jsfiddle without .css。

这是一个有效的jsfiddle with .css

问题是什么？

右括号被注释掉，因此你有一个非常明显的语法错误，它只是这样：

 .css ({ uh, oh, no right parenthesis :(

修改

您更新了代码，删除了导致错误的评论，您的解决方案正常运行，如demo所示。

id应该是一个带有数字的名称，该数字在每一代新div（name1，name2等）上递增。但我不能让div接受我指定的id。

如果我单击该面板2次，则会创建以下html：

<div id="photoContent1"><h1> Panel </h1><div id="showTable"><h2>add image</h2><div id="table"></div></div></div> <div id="photoContent2"><h1> Panel </h1><div id="showTable"><h2>add image</h2><div id="table"></div></div></div>

动态html生成div id麻烦

1 个答案: