1
$(document).ready(function() {
  var randomRed = Math.floor(Math.random() * 255);
  var randomGreen = Math.floor(Math.random() * 255);
  var randomBlue = Math.floor(Math.random() * 255);
  $('p').mouseover(function() {
      $('p').css('color', 'rgb(' + randomGreen + ',' + randomBlue + ',' + randomRed + ')');
  });
  $('p').mouseout(function() {
      $('p').css('color', 'black');
  });
});​

マウスオーバーでランダムな色を生成し、マウスアウトで黒に戻す上記のコードがありますが、これは正常に機能します。ただし、マウスオーバーごとに同じランダムな色が生成されます。

マウスオーバーイベントごとに異なるランダムな色を生成するにはどうすればよいですか??

4

3 に答える 3

1

これは、ホバー イベントではなくドキュメントの読み込み時に一度だけ色を生成するためです。

$(document).ready(function() {
    $('p').mouseover(function() {
        var randomRed = Math.floor(Math.random() * 255);
        var randomGreen = Math.floor(Math.random() * 255);
        var randomBlue = Math.floor(Math.random() * 255);
        $('p').css('color', 'rgb(' + randomGreen + ',' + randomBlue + ',' + randomRed + ')');
    });
    $('p').mouseout(function() {
        $('p').css('color', 'black');
    });
});
于 2012-09-19T10:09:04.237 に答える
0

このようにしてみてください

$(document).ready(function() {
function randomNumber(){
return  Math.floor(Math.random() * 255)
}

$('p').mouseover(function() {
    $('p').css('color', 'rgb(' + randomNumber()+ ',' + randomNumber()+ ',' +     randomNumber()+ ')');
});
$('p').mouseout(function() {
      $('p').css('color', 'black');
    });
});
于 2012-09-19T10:10:55.920 に答える
0

数値生成を関数として宣言し、イベントで呼び出すだけです:

$(document).ready(function() {
    function randomNumber(){
        return  Math.floor(Math.random() * 255)
    }

    $('p').mouseover(function() {
        $('p').css('color', 'rgb(' + randomNumber()+ ',' + randomNumber()+ ',' + randomNumber()+ ')');
    });
    $('p').mouseout(function() {
        $('p').css('color', 'black');
    });
});

.hover() を使用してイベント定義を簡素化することもできます: http://api.jquery.com/hover/

于 2012-09-19T10:09:25.003 に答える