随机颜色为<tr>

因此，总体来说，我试图在有人在他们身上放置鼠标时使盒子变色。颜色必须是随机的。我知道我错过了我的功能之间的连接点，但我不知道它是什么。随机颜色为<tr>

<!DOCTYPE html> 
<html onmousedown='event.preventDefault();' 
     onmouseenter = "colorize();" 
> 
<head> 
<title> Boxes </title> 
<meta charset='utf-8'> 
<style> 

    table { 
    border-spacing: 6px; 
    border: 1px rgb(#CCC); 
    margin-top: .5in; 
    margin-left: 1in; 
} 
    td { 
    width: 40px; height: 40px; 
    border: 1px solid black; 
    cursor: pointer; 
} 

</style> 
<script>

创建传递的元对象作为其参数，并设置使用 RGB（R，G，B）方法设定每个R，G和B的元素的背景颜色样式属性的函数称为彩色化）随机数介于0和255

function colorize() { 

    var 
    r = ('0'+(Math.random()*255|0).toString(16)).slice(-2), 
    g = ('0'+(Math.random()*255|0).toString(16)).slice(-2), 
    b = ('0'+(Math.random()*255|0).toString(16)).slice(-2); 
    return '#' +r+g+b; 
    } 

    function colorize(co) { 
    document.body.style.background = co; 
    } 

    </script> 
    </head> 
    <body> 
    <table> 
    <tbody> 
    <script type="text/javascript">

使用文件撰写（和for循环填写表中创建一个16×16盒表。对于每个td元素，创建一个onmouseenter调用来着色，并将其传递给元素本身（this）。

var row = 16; 
    var cols = 16; 

    for(var r=0;r<row;r++){ 
    document.write("</tr>"); 

    for(var c=0;c<cols;c++){ 
    document.write("<td></td>"); 
    } 

    document.write("</tr>"); 
    } 
    </script> 
    </tbody> 
    </table> 
    </body> 
    </html>

来源

2017-04-10 HTMLnoobcs17001

请解决您的格式使你的代码是清晰的。 – Carcigenicate

希望能帮到你！ – HTMLnoobcs17001

如果您的文字字体颜色与背景颜色相同，该怎么办？ – TeaCode

我不知道你想与身体的背景做什么，什么都不说，大约在你的文字。 ALos你的colorizer函数被覆盖。也许你想要这样的东西......？

<!DOCTYPE html> 
 
<html> 
 
<head> 
 
<title> Boxes </title> 
 
<meta charset='utf-8'> 
 
<style> 
 
table { 
 
    border-spacing: 6px; 
 
    border: 1px rgb(#CCC); 
 
    margin-top: .5in; 
 
    margin-left: 1in; 
 
} 
 
td { 
 
    width: 40px; height: 40px; 
 
    border: 1px solid black; 
 
    cursor: pointer; 
 
} 
 
</style> 
 
    
 
<script> 
 
    function colorize(el) { 
 
    var r = ('0'+(Math.random()*255|0).toString(16)).slice(-2), 
 
     g = ('0'+(Math.random()*255|0).toString(16)).slice(-2), 
 
     b = ('0'+(Math.random()*255|0).toString(16)).slice(-2); 
 
     el.style.backgroundColor = '#' +r+g+b; 
 
    } 
 

 
    </script> 
 
    </head> 
 
    <body> 
 
    <table> 
 
    <tbody> 
 
    <script type="text/javascript"> 
 
    var row = 16; 
 
    var cols = 16; 
 

 
    for(var r=0;r<row;r++){ 
 
    document.write("</tr>"); 
 

 
    for(var c=0;c<cols;c++){ 
 
     document.write("<td onMouseEnter='colorize(this);'></td>"); 
 
    } 
 
    document.write("</tr>"); 
 
    } 
 
    </script> 
 
    </tbody> 
 
    </table> 
 
    </body> 
 
    </html>

来源

2017-04-10 21:49:46

这正是我期待的！ – HTMLnoobcs17001

我很高兴这是你想要的，但请注意，这远不是最优代码。这里有几个优化要做，除非是一些爱好项目，否则我不会使用它。 –

它看起来像我错了没有建立和ID为彩色的地方你把“EL”。 – HTMLnoobcs17001

您需要使用colorize函数更新表格中的每个单元格。一个功能更换两个彩色化（）和彩色化（共）：

function colorize() { 
    var r = ('0'+(Math.random()*255|0).toString(16)).slice(-2), 
     g = ('0'+(Math.random()*255|0).toString(16)).slice(-2), 
     b = ('0'+(Math.random()*255|0).toString(16)).slice(-2); 

    for (var i = 0; i < document.getElementsByTagName("td").length; i++){ 
     document.getElementsByTagName("td")[i].style.backgroundColor = "#"+r+g+b; 
    } 
}

来源

2017-04-10 21:49:37 alfredo

这也可以！谢谢！ – HTMLnoobcs17001

我与IDS播放和添加onmousedown事件中调用FUNC html标记。

function colorize() { 
 

 
    var 
 
    r = ('0'+(Math.random()*255|0).toString(16)).slice(-2), 
 
    g = ('0'+(Math.random()*255|0).toString(16)).slice(-2), 
 
    b = ('0'+(Math.random()*255|0).toString(16)).slice(-2); 
 
    return '#' +r+g+b; 
 
    } 
 

 

 
function change(){ 
 
    var x = document.getElementById("1"); 
 
    var y = document.getElementById("2"); 
 
    x.style.color = colorize(); 
 
    y.style.color = colorize(); 
 

 
\t }

<table frame="box" onmousedown="change()"id="1" > 
 
    <tr> 
 
    <th>Month</th> 
 
    <th>Savings</th> 
 
    </tr> 
 
    <tr> 
 
    <td>January</td> 
 
    <td>$100</td> 
 
    </tr> 
 
</table> 
 

 
<table frame="box" onmousedown="change()" id="2" > 
 
    <tr> 
 
    <th>Month</th> 
 
    <th>Savings</th> 
 
    </tr> 
 
    <tr> 
 
    <td>February</td> 
 
    <td>$200</td> 
 
    </tr> 
 
</table>

来源

2017-04-10 21:52:27

随机颜色为<tr>

回答

相关问题