добавление div со стилем не совсем работает - PullRequest
Новая
       1

добавление div со стилем не совсем работает

0 голосов
/ 17 февраля 2012

Я очень новичок в лодке, поэтому, пожалуйста, не обращайте на меня внимания, если это глупый вопрос, однако я ожидал, что приведенный ниже код добавит 11 делителей в контейнер #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;
}

Ответы [ 3 ]

0 голосов
/ 17 февраля 2012

Пожалуйста, проверьте этот код!Верхнее значение можно установить! 

<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>
0 голосов
/ 17 февраля 2012

Напишите ваш скрипт в конце файла

, так как итерация цикла 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>
0 голосов
/ 17 февраля 2012

Вы пропустили точку с запятой после top:: 

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

Кроме того, вам не нужно экранировать двойные кавычки в строках с одинарными кавычками, вам нужно только экранировать кавычки внутри строк, если сама строка использует этот тип кавычек. 

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

EDIT:

Из тестирования может показаться, что с последней точкой с запятой или без нее мой браузер (Chrome) не жалуется. Однако совет здесь гласит:

Вы должны всегда включать точку с запятой после правила, даже если вы только создание одного правила. Правда, одно правило будет работать большую часть время, если вы забудете точку с запятой, но результаты могут быть непредсказуемыми в некоторые случаи. Это также хорошая привычка. Если вы всегда включаете точка с запятой для отдельных правил, меньше шансов, что вы оставите один где это необходимо в качестве разделителя правил при создании нескольких правила для одного селектора.

Это может быть, а может и не быть проблемой, специфичной для браузера, если это действительно проблема.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Похожие темы

...