如何将.hover函数添加到单元格中的图像?

时间:2018-02-22 12:51:30

标签: javascript jquery css

我有一个由Sharepoint生成的HTML。我添加了一个表格和几张图片,我想将.hover添加到选定的图像中。经过长时间的痛苦,我可以使用.querySelector选择图像,但如果我尝试:

    $(document).ready(function ()
    {
      document.querySelector('.ms-rteTableEvenCol-0 > a > img').hover(function ()
      {
        $(this).css('opacity', '.3');
      }, function ()
      {
      $(this).css('opacity', '1');
      });
    });

我得到" Uncaught TypeError:document.querySelector(...)。hover不是函数"。我添加了Jquery,因此不能成为原因。 (大多数相关主题建议添加它)

如果我尝试.onmouseover

$(document).ready(function ()
{
  document.querySelector('.ms-rteTableEvenCol-0 > a > img').onmouseover = function()
  {
   $(this).css('opacity', '.3');
  }
});

这样可行,但效果是永久性的,因此即使鼠标离开图像,透明度仍保持30%。所以我想使用.hover,但我没有经验,所以我不知道会出现什么问题,请帮我一把。

3 个答案:

答案 0 :(得分:6)

试试这个:

function array_to_xml($array, &$xml) {
    foreach($array as $key => $value) {
        if(is_array($value)) {
            if(!is_numeric($key)){
                $subnode = $xml->addChild("$key",'','');
                array_to_xml($value, $subnode);
            } else {
                array_to_xml($value, $xml);
            }
        } else {
            $xml->addChild("$key","$value",'');
        }
    }
};

答案 1 :(得分:3)

就错误而言,在添加jQuery时,您需要使用自己的引擎来访问hover函数(它不会扩展本机对象)。

所以使用

jQuery('.ms-rteTableEvenCol-0 > a > img').hover(function ()
另一方面,你可以使用CSS

.ms-rteTableEvenCol-0 > a > img:hover{
   opacity:0.3;
}

答案 2 :(得分:2)

您正尝试在DOM选定元素 document.querySelector()上使用jQuery方法 .hover()

您只能在jQuery对象上调用jQuery方法。使用jQuery作为选择器以获取一个jQuery对象,然后可以调用hover方法。

$(document).ready(function () {
  $('.ms-rteTableEvenCol-0 > a > img').hover(function () {
    $(this).css('opacity', '.3');
  }, function () {
      $(this).css('opacity', '1');
  });
});