代码之家  ›  专栏  ›  技术社区  ›  meo

简单切换问题

  •  0
  • meo  · 技术社区  · 15 年前

    我只是编写了一个小函数,通过淡入淡出来切换内容。

    this.advancedSearch = function(fieldset, triggerBtn){
        fieldset.hide()
        triggerBtn.click(function(){
            fieldset.toggle(function(){ $(this).stop(false, true).fadeIn(300) }, function(){ $(this).stop(false, true).fadeOut(300) });
            return false;
        })
    }
    

    如果只是我用 toggle() 它可以工作,但是当我插入这两个函数时,不会发生任何事情,也不会抛出任何错误。我做错什么了吗?

    3 回复  |  直到 15 年前
        1
  •  3
  •   user113716    15 年前

    我假设您希望triggerbtn在fieldset上触发toggle事件。

    如果是,请尝试以下操作:

    this.advancedSearch = function(fieldset, triggerBtn){
        fieldset.hide();
        triggerBtn.click(function(){
            fieldset.click();
        });
        fieldset.toggle(function(){ $(this).stop(false, true).fadeIn(300) }, 
                        function(){ $(this).stop(false, true).fadeOut(300) })
    }
    

    你的方式,每次你点击 triggerBtn 你是 指派 将事件处理程序切换到 fieldset .


    编辑:

    或者,如果不需要启用单击(切换)事件 字段集 总之,大卫的回答会起作用的。

        2
  •  3
  •   David Fullerton    15 年前

    您希望将切换事件附加到正在单击的对象:

    this.advancedSearch = function(fieldset, triggerBtn) {
        fieldset.hide()
        triggerBtn.toggle(
            function(){ fieldset.stop(false, true).fadeIn(300) }, 
            function(){ fieldset.stop(false, true).fadeOut(300) }
        );        
    }
    
        3
  •  1
  •   z33m    15 年前

    toggle 函数绑定元素上的单击事件,该事件自动切换元素。因此,在按钮click callback中调用toggle不会切换元素,它只是绑定一个事件。手工实现比使用切换要简单得多。

    this.advancedSearch = function(fieldset, triggerBtn){
        fieldset.hide()
        triggerBtn.click(function(){
            if(fieldset.hasClass('toggle-on')) {
                fieldset
                    .removeClass('toggle-on')
                    .stop(false, true).fadeOut(300);
            }
            else {
                fieldset
                    .addClass('toggle-on')
                    .stop(false, true).fadeIn(300);
            }
            return false;    
        })
    }