仅创建第二次点击事件 Javascript

Create Second Click Event Javascript Only

本文关键字：事件 Javascript 创建 第二次      更新时间：2023-09-26

当我单击按钮时，我需要让图像更改不透明度，然后在再次单击按钮时更改回来。我只能使用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";
    });
}

试试这个

.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/

使用一键式事件并将 if/else 语句放入其中。

button1.addEventListener('click', function() {
     if (chrome.style.opacity = "1.0"){
          chrome.style.opacity = "0.5" 
    }else{
          chrome.style.opacity = "1.0"
    }
 });

只是对你的代码的评论：

> var bool = new Boolean();

你真的不想那样做。布尔对象的存在是为了支持布尔基元，而不是单独使用。此外，在必须分配值之前，不要分配值。将变量初始化为临时值是没有意义的，它当然不会"类型化"变量。

ECMAScript 变量没有类型，它们的值有。所以当你以后做：

> bool = true;

bool 不再引用以前分配的对象，它现在的值为 true 。

无论如何，这里可以完全避免使用bool，请参阅其他答案。

哦，为什么你应该避免布尔对象：

// Create a Boolean object with a value of false
var foo = new Boolean(false); 
// Evaluate in expression that will call internal getValue method
alert( foo );  // false
// Evaluate in expression that will do Type conversion
alert( !foo ); // false

哎呀！可以肯定的是：

alert( foo == !foo  ); // true!!
alert( foo == !!foo ); // false

所以远离布尔对象！即使您利用这种行为来发挥自己的优势，可读性和维护也会受到影响。

相关文章：