0

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

3 回答 3

0

使用单击事件并将 if/else 语句放入其中。

button1.addEventListener('click', function() {
     if (chrome.style.opacity = "1.0"){
          chrome.style.opacity = "0.5" 
    }else{
          chrome.style.opacity = "1.0"
    }
 });
于 2013-10-31T02:34:05.357 回答
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/

于 2013-10-31T02:37:31.667 回答
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

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

于 2013-10-31T03:02:52.807 回答