Question

我正在尝试在javascript中编写一个简单的按钮控件，它将自动包含切换功能，因此每次它工作时它都会更改元素的显示或隐藏。我认为这很容易，但我无法让它发挥作用。

simplify: function(){
    aRemoveButtons[t].show();

    //next time 
    aRemoveButtons[t].hide();
}

我试图设置一个变量，然后在它上面做一个！变量，但是我无法检查它是否存在，因为它是一个布尔值，并且看到它与undefined相同。

Answer 1

您使用的是jQuery吗？它有一个内置的切换方法：http://api.jquery.com/toggle/

$('.target').toggle();

Answer 2

尝试类似：

function toggle(elementID) {
    var target1 = document.getElementById(elementID); // get the element
    if (target1.style.display == 'none') { // check current state
        target1.style.display = 'block'; // show
    } else {
        target1.style.display = 'none';  // hide
    }
}

用法：

<div id="something" style="display:none;"></div>

toggle('something');

Answer 3

Ext.override(Ext.Element, {
    toggle : function()
    {
        // check current state of visibility
        var mode = this.getVisibilityMode();
        var hideClass = '';

        switch (mode) {
            case Ext.Element.prototype.VISIBILITY:
                    hideClass = 'x-hidden-visibility';
                break;
            case Ext.Element.prototype.DISPLAY:
                    hideClass = ''x-hidden-display';
                break;
            case Ext.Element.prototype.OFFSETS:
                    hideClass = 'x-hidden-offsets';
                break;
        }

        // default should be visible
        var visible = true;
            // if class exists then the element is hidden
        if(this.hasCls(hideClass)) {
            visible = false;
        }

        this.setVisible(!visible);
    }
});

在javascript中切换功能

3 个答案: