fool Posted May 20, 2020 Posted May 20, 2020 Need some help here, how to make the result not repeat itself? For example, if the color is red, the next click shouldn't be red also? <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>01</title> <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css" integrity="sha384-9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk" crossorigin="anonymous"> </head> <body> <div class="container"> <div class="row vh-100 d-flex align-items-center"> <div class="col text-center"> <button>Click Me!</button> </div> </div> </div> </div> <script> const button = document.querySelector('button') const body = document.querySelector('body') const colors = ['red', 'green', 'blue', 'yellow', 'pink', 'purple'] body.style.backgroundColor = 'violet' button.addEventListener('click', changeBackground) function changeBackground(){ const colorIndex = parseInt(Math.random()*colors.length) body.style.backgroundColor = colors[colorIndex] } </script> </body> </html> Quote
fool Posted May 22, 2020 Author Posted May 22, 2020 Okay, seriously need some JavaScript help here since I can't find it on Google. function GenerateRandomColor() { return '#' + Math.floor(Math.random()*16777215).toString(16); } What does '#' mean? Quote
SneakyDave Posted May 22, 2020 Posted May 22, 2020 # is the symbol to indicate a color code value, just like your function calls for. #ffffff = white #ff0000 = red #000000 = black Quote "I wonder if wife Susie knows about the vile crap he posts on his site and how it fits in with her "youth ministry"?" - Dr. Howard Rosenzweig, former owner of TheAdminZone
fool Posted May 27, 2020 Author Posted May 27, 2020 Okay Ralph, I read all your replies and they're very helpful. Need a little bit of help here <h1>0</h1> <button>+</button> Can you write a simple function so that on every click on <button>+</button>, <h1>0</h1> will increase? I'm kinda stuck here. Tried to write it several ways but failed. const button = document.querySelector('button') const counter = document.querySelector('h1') button.addEventListener('click', function(){}) Quote
SneakyDave Posted May 27, 2020 Posted May 27, 2020 Are you using jQuery? Quote "I wonder if wife Susie knows about the vile crap he posts on his site and how it fits in with her "youth ministry"?" - Dr. Howard Rosenzweig, former owner of TheAdminZone
fool Posted May 27, 2020 Author Posted May 27, 2020 Are you using jQuery? No, can't this be done with vanilla JavaScript? Quote
SneakyDave Posted May 27, 2020 Posted May 27, 2020 Yeah, but I can't remember the format. Always have to google Quote "I wonder if wife Susie knows about the vile crap he posts on his site and how it fits in with her "youth ministry"?" - Dr. Howard Rosenzweig, former owner of TheAdminZone
fool Posted May 27, 2020 Author Posted May 27, 2020 Just found this on google; https://codepen.io/juliogcampos/pen/BzdjwY It's good now, just need to replace onclick with addEventListener. Quote
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.