Mootools用于输入框的clickout功能

Question

为什么这不能正常工作？

首次点击时应将输入宽度设置为300，然后在正文上单击为100，

如果有人知道mootools的元素点击功能，请告知

如果您知道如何将其设置回原始盒子尺寸

，那将是多么棒的

http://jsfiddle.net/V6bTN/10/

window.addEvent('load', function() {
    var box = $$('#searchfeed');
    var isopen = box.hasClass('open');

    box.addEvent('click', function myfunction(event) {

        box.addClass('open');
        box.morph({
            width: 300
        });

    });


    if (isopen) {
        $(document.body).addEvent('click', function(event) {
            box.morph({
                width: 100
            });
            box.removeClass('open');

        });
    }



});​

Answer 1

这是一个简单的outerClick函数。

Element.Events.outerClick = {
    base : 'click',    
    condition : function(event){
        event.stopPropagation();
        return false;
    },
    onAdd : function(fn){
        this.getDocument().addEvent('click', fn);
    },
    onRemove : function(fn){
        this.getDocument().removeEvent('click', fn);
    }
};

使用：

el.addEvent('outerClick', function(){ this.destroy(); });