Javascript 当鼠标悬停在输入文本上时，如何显示输入按钮？ 我想发生什么 当鼠标悬停在工作表问题上时输入文本，我需要。按钮添加 显示，用户可以单击它。当用户悬停时 远离工作表问题输入文本，我需要。按钮添加 逐渐消失 当鼠标悬停在.button bullet上时，我想要.button bullet 要消失，请单击按钮“删除”，以在其位置淡入淡出

我觉得这应该很简单。我可能使用了不正确的jQuery函数

实际发生了什么

.button add

保持闪烁，并在

之间协调。button remove

淡入和

淡入。按钮项目符号

消失失败

添加按钮故障

消除按钮故障

我的代码 我将

按钮的
显示
。添加按钮

和

按钮删除按钮

设置为

无

。然后我使用

fadeIn（）

和

fadeOut（）

切换了它们的

显示

，以及

按钮子弹

的

显示

HTML

jQuery

试试这个：

$(document).ready(function(){

    $("input[type='text'][name='Worksheet-Problem']").closest('.row').hover(function()      {
        $(".button-add").fadeToggle(300);
    })
    $(".button-bullet").closest('.input-group-btn').hover(function(){
        $('.button-bullet').toggle();
        $(".button-remove").toggle();
    })

    $(".button-add").click(function(){
        console.log("Add-Button pressed");
    })
    $(".button-remove").click(function(){
        console.log("Remove-Button pressed");
    })
})

---

考虑当用户与包装器（在这种情况下是代码>表单组< /代码>）时触发事件，因为这可能会在它们来回移动时提供更好的过渡。您也可以减少代码，使用

fadeToggle

而不是

fadeOut

和

fadeIn

我会将您的小提琴更新到所需的效果给我15分钟我会为您发布答案

$("input[type='text'][name='Worksheet-Problem']").focus(function(){
        $(".button-add").fadeIn(300);  
    })
    $("input[type='text'][name='Worksheet-Problem']").hover(function(){
        $(".button-add").fadeIn(300);
    })
    $("input[type='text'][name='Worksheet-Problem']").mouseout(function(){
        $(".button-add").fadeOut(300);
    })
    $(".button-bullet").hover(function(){
        $(this).hide();
        $(".button-remove").fadeIn(300);
    })
    $(".button-remove").mouseout(function(){
        $(this).fadeOut(300);
        $(".button-bullet").fadeIn(300);
    })

$(document).ready(function(){

    $("input[type='text'][name='Worksheet-Problem']").closest('.row').hover(function()      {
        $(".button-add").fadeToggle(300);
    })
    $(".button-bullet").closest('.input-group-btn').hover(function(){
        $('.button-bullet').toggle();
        $(".button-remove").toggle();
    })

    $(".button-add").click(function(){
        console.log("Add-Button pressed");
    })
    $(".button-remove").click(function(){
        console.log("Remove-Button pressed");
    })
})