javascript - 使用 Javascript 单击后如何将输入类型按钮更改为“display=none”？

Question

我有一个按钮，一旦单击，我就想隐藏它。此外，我只是不想隐藏它，我希望它style='display:none'一旦点击。

Answer 1

<button onclick="this.style.display='none';">a button</button>

见例子：http: //jsfiddle.net/uWfYk/

Answer 2

附加一个事件以使用 JS 样式onclick隐藏和应用样式，见下文，display:none

<input type="button" name="btn" value="Hide me" onclick="this.style.display='none'" />

Answer 3

2020 年更新：

所有主流浏览器都支持并支持它addEventListener()，它可以是querySelector()

document
  .querySelector('#the-important-button')
  .addEventListener('click', ev => ev.target.style.display = 'none');

<button id="the-important-button">Click</button>

2012年的回答：

为了让它不引人注目并在早期的 IE 和其他现代浏览器上工作：

的HTML：

<button id="the-important-button">Submit</button>​

JavaScript：

var theButton = document.getElementById('the-important-button');

function hideTheButton() {
    this.style.display = 'none';
}

function addEvent(target, type, handler) {
    if (target.addEventListener) {
        target.addEventListener(type, handler, false);
    } else if (target.attachEvent) {
        target.attachEvent('on' + type, function() {
            return handler.call(target, window.event);
        });
    } else {
        target['on' + type] = handler;
    }
}

addEvent(theButton, 'click', hideTheButton);

请注意，这addEvent是一个在早期 IE 和其他现代浏览器上运行良好的通用函数。您可以添加与上面最后一行代码类似的其他事件。

http://jsfiddle.net/W37Fb/5/上的示例

Answer 4

http://jsfiddle.net/uWfYk/2/

使用jquery如下

$("#btn").click(function(){
    //do need full
    $(this).fadeOut();
})​

使用纯 JS

http://jsfiddle.net/PeM2b/