0

我有一个输入文本框,一旦用户单击按钮就会淡入,然后如果用户再次单击按钮就会淡出。每次用户点击按钮时,输入都是焦点,因为通常他们做的第一件事就是打字。问题是输入有一个占位符,当用户再次单击按钮时,占位符在输入淡出时以非常烦人的方式闪烁一次(这仅在用户再次单击按钮时输入聚焦时才会发生)。

所以我昨天整晚都在尝试做的是让输入焦点只在用户第一次点击按钮时,他们第二次点击淡出时,输入不应该集中。

你能帮我实现这个吗?非常感谢!

        //takes care of showing search when clicking on add button
jQuery(".add-button").click(function() {



//shows and hides the textbox input
    jQuery(this).siblings(".search-input-form").fadeToggle(200);



 //triggers a focusing on the textbox input
    jQuery(this).next().children(".search-input").focus();




    return false;

}); 
4

2 回答 2

2

您可以使用$.toggle()函数。它在单击时在提供的功能之间交替。

$(".add-button").toggle(function() {
        var $input = $(this);

        //shows the textbox input
        $input.siblings(".search-input-form").fadeIn(200);

       //triggers a focusing on the textbox input
       $input.next().children(".search-input").focus();

       return false;
    },
    function() {
        var $input = $(this);

        //hides the textbox input
        $input.siblings(".search-input-form").fadeOut(200);

       // NO FOCUS HERE

       return false;
    }); 
于 2012-08-23T14:30:30.820 回答
1

切换和:fadeToggle_fadeInfadeOut

    jQuery(".search-input-form").click(function () {

        if (jQuery(".search-input-form").css("visibility") = "hidden")
        {
            jQuery(this).siblings(".search-input-form").fadeIn(200);
            jQuery(this).next().children(".search-input").focus();
        }
        else 
        {
            jQuery(this).siblings(".search-input-form").fadeOut(200);
        }
        return false;

    });         
于 2012-08-23T14:31:06.897 回答