2012-02-17 25 views
0

私はボートでとても新鮮ですので、これはちょっと疑問ですが気にしないでください。しかし、以下のコードが#roadコンテナに11個のdivを追加することを期待していました。変数を介して上と左が割り当てられます。左の位置は期待どおりに設定されますが、上は設定されません。どんな助け?スタイルが正しく動作していないdivを追加する

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; 
} 
+0

どのように設定されていませんか?一番上の設定は有効ではありませんか?生成しているCSSには最高の価値はありませんか?あなたは11divsを取得していないのですか? –

答えて

0

あなたはtop:後にセミコロンが欠落している:

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

また、あなたは、単一引用符文字列に二重引用符をエスケープする必要はありません、あなただけの場合は、文字列内の引用符をエスケープする必要があるだろう文字列自体がその引用符型を使用していました。

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

EDIT:

テストから、最後のセミコロンの有無にかかわらず、私のブラウザ(クローム)が文句を言わないことと思われます。しかし、アドバイスhereは言う:

あなたはいつもあなたが 一つだけのルールを作成している場合でも、ルールの後にセミコロンを含める必要があります。真実は、あなたがセミコロンを忘れた場合、単一のルールが 時間のほとんどを動かすでしょうが、結果は いくつかのインスタンスでは予測できないことがあります。それはまた良い習慣です。 1つのルールに常に セミコロンを含める場合、1つのセレクタに対して複数のルールを作成するときに、ルールの区切りとして必要な場所には、 を残すことはありません。

実際に問題がある場合は、ブラウザ固有の問題である場合としない場合があります。

+0

セミコロンは、CSSでは*セパレータ*であり、*ターミネータではない*ので、最後のセミコロンはオプションです。 –

+0

エスケープされた引用符も問題ではありません。エスケープは重複していますが無害です。 –

+0

はい、それはちょうど読みやすくなりました。さもなければ、各文字をエスケープしないでください:P正しいこともあります。最後のセミコロンは、インラインCSSではオプションです。 –

0

このコードを確認してください!最高の価値を設定することができます!

<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

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> 
関連する問題