仅创建第二次单击事件Javascript(Create Second Click Event Javascript Only)

仅创建第二次单击事件Javascript(Create Second Click Event Javascript Only)

当我单击按钮然后再次单击按钮时更改后，我需要更改图像不透明度。 我只能使用Javascript。 我已经设置了2个if / else语句，当我第一次发生事件时单击按钮但是我无法进行第二次事件。 我是javascript的新手。

var img = document.querySelector('#img'); var button1 = document.querySelector('#button1'); var bool = new Boolean(); if (chrome.style.opacity = "1.0"){ bool = true; } else if (chrome.style.opacity = "0.5"){ bool = false; } if (bool){ button1.addEventListener('click', function() { chrome.style.opacity = "0.5"; }); } else{ button1.addEventListener('click', function() { chrome.style.opacity = "1.0"; }); }

I need to have an image change opacity when I click a button and then change back when I click the button again. I can only use Javascript. I've set up 2 if/else statements and when I click the button the first time the event happens but I can't get a second event to happen. I'm very new to javascript.

var img = document.querySelector('#img'); var button1 = document.querySelector('#button1'); var bool = new Boolean(); if (chrome.style.opacity = "1.0"){ bool = true; } else if (chrome.style.opacity = "0.5"){ bool = false; } if (bool){ button1.addEventListener('click', function() { chrome.style.opacity = "0.5"; }); } else{ button1.addEventListener('click', function() { chrome.style.opacity = "1.0"; }); }

最满意答案

尝试这个

HTML

<button id="button1">hi</button>

CSS

button { opacity: 0.5; }

JS

button1.addEventListener('click', function() { this.style.opacity = (this.style.opacity == 1.0) ? 0.5 : 1.0; });

我想你的js实际上就是这个..只是适应它

button1.addEventListener('click', function() { chrome.style.opacity = (chrome.style.opacity == 1.0) ? 0.5 : 1.0; });

http://jsfiddle.net/Q4C6g/

Try this

html

<button id="button1">hi</button>

css

button { opacity: 0.5; }

js

button1.addEventListener('click', function() { this.style.opacity = (this.style.opacity == 1.0) ? 0.5 : 1.0; });

i suppose your js would actually be this ..just adapt it

button1.addEventListener('click', function() { chrome.style.opacity = (chrome.style.opacity == 1.0) ? 0.5 : 1.0; });

http://jsfiddle.net/Q4C6g/