php - 鼠标悬停时更改 Bootstrap "well"的颜色

Question

我想在鼠标悬停时更改“井”的颜色，但无法做到。我一直在尝试使用以下代码:

<script type="text/javascript">
    function ChangeColor(well, highLight)
    {
    if (highLight)
    {
      well.style.backgroundColor = '#dcfac9';
    }
         }
</script>
PHP:

echo "  <div class=\"well\" onmouseover=\"ChangeColor(this, true);\"\n"; 
echo " onmouseout=\"ChangeColor(this, false);\"> \n"; 
echo "something";
echo "  </div>\n"; 

上面的代码在鼠标悬停时很好地改变了颜色，但它穿过了“井”的区域。请帮助修复它。

Answer 1

<link rel="stylesheet"  href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css"/>


<div class="well">
	 <p>
     This is a well content
   </p>
</div>


<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<script>
  $(".well").mouseenter(
    function(){
      $(this).css('background-color','red');
    });
  
   $(".well").mouseleave(
    function(){
      $(this).css('background-color','#f5f5f5');
    });
</script>