推送數組中屬性的值
[英]Push Value of attribute in array
問題描述
$(document).ready(function() { function randomColor() { return 'rgb(' + Math.round(Math.random() * 255) + ', ' + Math.round(Math.random() * 255) + ', ' + Math.round(Math.random() * 255) + ')' } $('.Showcolor #button').each(function(i) { $(this).css('background-color', randomColor()); }) var Random = []; var color = $(".Showcolor #button").css("background-color"); for (i = 0; i < button.length; i++) { Random.push(color); } console.log(Random); });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <html> <head> <title>captcha</title> <link rel="stylesheet" href="style.css"> </head> <body> <h1>Click on circle matching right circle</h1> <div class="box"> <div class="Showcolor"> <button class="Black"></button> <button class="Blue"></button> <button class="Orange"></button> <button class="Pink"></button> <button class="Purple"></button> <button class="Skyblue"></button> <button class="Brown"></button> </div> <div="match"> <button class="Random"></button> </div> <input type="text" name="color" class="color" disabled> </div> <script src="jquery.3.js"></script> <script src="file.js"></script> </table> </body> </html>
我試圖將為每個按鈕生成的顏色存儲到一個顏色數組（隨機）中，以便另一個按鈕（類名 = 隨機）可以從這個特定的數組中選擇一種顏色。 你能幫我找到解決辦法嗎？
2 個解決方案
解決方案1
1 已采納 2018-09-28 09:20:35
首先， id屬性在同一個文檔中必須是唯一的，所以用公共類替換重復的屬性，如：
<button class="button Black">Black</button>
<button class="button Blue">Blue</button>
<button class="button Orange">Orange</button>
您可以使用map遍歷它們並將顏色推送到數組：
$(document).ready(function() { var buttons = $('.Showcolor .button'); var Random = buttons.map(function(i) { var generated_color = randomColor(); $(this).css('background-color', generated_color); return generated_color; }).get(); $('.random').on('click', function() { $('.random').css('background-color', Random[Math.floor(Math.random() * Random.length)]); }) }); function randomColor() { return 'rgb(' + Math.round(Math.random() * 255) + ', ' + Math.round(Math.random() * 255) + ', ' + Math.round(Math.random() * 255) + ')' }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <h1>Click on circle matching right circle</h1> <div class="box"> <div class="Showcolor"> <button class="button Black">Black</button> <button class="button Blue">Blue</button> <button class="button Orange">Orange</button> <button class="button Pink">Pink</button> <button class="button Purple">Purple</button> <button class="button Skyblue">Skyblue</button> <button class="button Brown">Brown</button> </div> <br> <div id="match"> <button class="random">Random</button> </div> </div>
解決方案2
0 2018-09-28 09:18:15
修復 ID。 然后代替
$('.Showcolor #button').each(function(i) {
$(this).css('background-color', randomColor());
})
用
$('.Showcolor > button').each(function(i) {
$(this).css('background-color', randomColor());
})
選擇Showcolor <div>下的所有<button>元素
如何將元素屬性值推入javascript數組？
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.