javascript：帶屋頂和地板的隨機顏色生成器

Question

嗨我前幾天隨機玩數學並製作了RGB彩色生成器，併成功地使用文本輸入來限制隨機數的頂部，但是無法讓地板工作。這裏是的jsfiddle http://jsfiddle.net/synthet1c/3KR83/

這裏是JavaScript函數我做

function randomColor(){ 

    var roof = document.getElementById('textRoof').value, 
     floor = document.getElementById('textFloor').value; 

    var r = Math.floor((Math.random()*roof)+floor); 
    var g = Math.floor((Math.random()*roof)+floor); 
    var b = Math.floor((Math.random()*roof)+floor); 


    if (r < 10) { var r = "0" + r} 
    if (r < 100) { var r = "0" + r}; 

    if (g < 10) { var g = "0" + g}; 
    if (g < 100) { var g = "0" + g}; 

    if (b < 10) { var b = "0" + b}; 
    if (b < 100) { var b = "0" + b}; 

    document.getElementById('header').style.color= "rgb("+r+","+g+","+b+")" 
    document.getElementById('text').value = "rgb("+r+","+g+","+b+")" 

} 

這僅僅是學習它的緣故，但任何幫助表示讚賞。

乾杯

Answer 1

var roof = document.getElementById('textRoof').value, 
    floor = document.getElementById('textFloor').value; 

// convert the string values to integer values 
roof = parseInt(roof); 
floor = parseInt(floor); 

var r = Math.floor((Math.random()*(roof-floor))+floor); 
var g = Math.floor((Math.random()*(roof-floor))+floor); 
var b = Math.floor((Math.random()*(roof-floor))+floor); 

live example

Answer 2

1. 你地板是文本。你需要一個整數 - parseInt。

2. 您可以通過使用位移簡化您的顏色獲取。

   function randomColor(){ 
   
   var roof = parseInt(document.getElementById('textRoof').value), 
       floor = parseInt(document.getElementById('textFloor').value); 
   
   var r = floor + Math.floor(Math.random()*(roof-floor)); 
   var g = floor + Math.floor(Math.random()*(roof-floor)); 
   var b = floor + Math.floor(Math.random()*(roof-floor)); 
   
   var color = ((r << 16) + (g << 8) + b).toString(16); 
   
   document.getElementById('header').style.color= 
       "#000000".replace(new RegExp(".{"+color.length+"}$"), color); 
   
   document.getElementById('text').value = "rgb("+r+","+g+","+b+")" 
   
   }