Warning: file_get_contents(/data/phpspider/zhask/data//catemap/2/unit-testing/4.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 在悬停事件处理程序上添加类_Javascript_Jquery_Html_Css - Fatal编程技术网
Fatal编程技术网
  • javascript/
  • Javascript 在悬停事件处理程序上添加类

Javascript 在悬停事件处理程序上添加类

javascript jquery html css

Javascript 在悬停事件处理程序上添加类,javascript,jquery,html,css,Javascript,Jquery,Html,Css,有一个submit按钮。和一个文本框。我想用classname:search将鼠标悬停在按钮上，然后将类切换到我的文本框。 问题是，当我想在文本框中输入时，它不起作用。我怎样才能解决这个问题？ 这是我的密码： $（“.search”）.hover（函数（）{ $（“.searchinput”）.toggleClass（“searchinput2”）； }); .searchinput{宽度：2%；高度：30px；背景：黄色；字体大小：1.5em；} .searchinput2{宽度：50%！重

有一个
submit
按钮。和一个
文本框
。我想用
classname:search
将鼠标悬停在
按钮上
，然后将类切换到我的
文本框
。 问题是，当我想在文本框中输入时，它不起作用。我怎样才能解决这个问题？ 这是我的密码：

$（“.search”）.hover（函数（）{
$（“.searchinput”）.toggleClass（“searchinput2”）；
});

.searchinput{宽度：2%；高度：30px；背景：黄色；字体大小：1.5em；}
.searchinput2{宽度：50%！重要；}




搜索
您应该使用
.mouseenter
和
.mouseleave
事件



$（“.search”）.mouseenter（函数（）{
$（“#searchinput”）.addClass（'searchinput2'）；
});
$（“.searchinput”）.mouseleave（函数（）{
$（“#searchinput”）.removeClass（'searchinput2'）；
});

.searchinput{宽度：2%；高度：30px；背景：黄色；字体大小：1.5em；}
.searchinput2{宽度：50%！重要；}




搜索
我希望将此代码与悬停不单击事件一起使用，尽管此解决方案有效。但是，我不明白为什么它没有使用
hover
。正如文档所说：.hover（）方法绑定了mouseenter和mouseleave事件的处理程序。@Alexandru IonutMihai非常感谢您。@Abhi，因为
hover
应用于
button
元素，这就是出现这种行为的原因。查看更新的答案。