Question

我在船上非常新鲜所以如果这是一个愚蠢的问题请不要介意我，但是，我希望下面的代码将11个div添加到#road容器中，顶部和左侧分配通过变量。左侧位置按预期设置，但顶部根本没有设置。任何帮助??

for (var a=0; a<11; a++) {
 left = getRandom(250,190)*a+250+a*20+'px';
 top = getRandom(220,0)+'px';
 $('#road').append('<div class=\"bumper\" style=\"left:'+left+';top:'+top+'\"></div>');
}

function getRandom(i,j) {
 var diff;
 var ranNum;
 diff = i-j;
 ranNum = i-Math.round(Math.random() * diff);
 return ranNum;
}

Answer 1

top:之后你错过了一个分号：

$('#road').append('<div class=\"bumper\" style=\"left:'+left+'; top:'+top+';\"></div>');

此外，您不需要在单引号字符串中转义双引号，如果字符串本身使用该引号类型，则只需要在字符串内转义引号。

$('#road').append('<div class="bumper" style="left:'+left+'; top:'+top+';"></div>');

修改

从测试开始，无论是否使用最后一个分号我的浏览器（Chrome）都不会抱怨。但是，建议here说：

你应该在规则之后包括分号，即使你是只创建一个规则。事实是，单一规则将适用于大多数如果你忘记了分号，那么结果可能是无法预测的一些情况。这也是一个好习惯。如果你总是包括对于单一规则的分号，你将不太可能留下一个在创建多个时，将其作为规则分隔符所需的位置一个选择器的规则。

它可能是也可能不是浏览器特定的问题，如果确实是问题。

Answer 2

请检查此代码！最高值可以设置！

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script>
function appendDiv(){
    for (var a=0; a<11; a++) {
     left = getRandom(250,190)*a+250+a*20+'px';
     top = getRandom(220,0)+'px';
     $('#road').append('<div class="bumper" style="left:'+left+';top:'+top+'">asdfsd s</div>');
    }
}

function getRandom(i,j) {
 var diff;
 var ranNum;
 diff = i-j;
 ranNum = i-Math.round(Math.random() * diff);
 return ranNum;
}
</script>
<input type="button" onclick="appendDiv()" value="click">
<div id="road"></div>

Answer 3

将您的脚本写在文件末尾

因为for循环的迭代没有写入任何被称为before page load的函数中。

<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
</head>

<body>
<div id="road"></div>
</body>


<script>
for (var a=0; a<5; a++) {
  left = getRandom(250,190)*a+250+a*20+'px';
  top = getRandom(220,0)+'px';

 $('#road').append('<div class=\"bumper\" style=\"left:'+left+';top:'+top+'\">'+a+'</div>');
}

function getRandom(i,j) {
 var diff;
 var ranNum;
 diff = i-j;
 ranNum = i-Math.round(Math.random() * diff);
 return ranNum;
}
</script>
</html>

追加div风格不太合适

3 个答案: