0

有人可以帮助我指出使用 javascript 更改多种内联样式的方向,例如:OnMouseOver、OnMouseOut,然后更改回车键?

我有 2 个 onclick 鼠标悬停/退出需要发生的事情,然后在 Enter 键按下状态后需要将图形更改为加载图形?

鼠标悬停状态之前:

src="images/transparent_100x100.png" style="background:url(/images/image_giblets_20x.png) no-repeat scroll right -414px transparent"

鼠标悬停状态 - 从右到左更改:

src="images/transparent_100x100.png" style="background:url(/images/image_giblets_20x.png) no-repeat scroll left -414px transparent"

单击开始搜索后 - 将图像更改为此并删除 [样式详细信息]:

src="images/loading2.gif"

到目前为止,这是我为 OnMouseOver/Out 部分所做的尝试。

<img id="nb_search_magglass" alt="Search" border="0"
onmouseover="document.getElementById('nb_search_magglass').style.background: url(/images/image_giblets_20x.png) no-repeat scroll left -414px transparent;"

onmouseout="document.getElementById('nb_search_magglass').style=.background: url(/images/image_giblets_20x.png) no-repeat scroll right -414px transparent;"

style="background:url(/images/image_giblets_20x.png) no-repeat scroll right -414px transparent" src="images/transparent_100x100.png" width="23px" height="23px" />
4

1 回答 1

-1

您可以使用 jQuery。这是您可以使用的事件的详细列表:http: //api.jquery.com/category/events/

这个想法是:

<html>
<head>
  <script>
  jQuery(document).ready(function() {
      $("img.wanna-change").mouseover(function() {
         // this this here is the <img> object. Here I make it into a
         //   jQuery object but you can put any javascript code here
         $(this).attr("style", "background:url() no-repeat scroll; width: 20px;")
      });
  </script>
</head>
<body>
  <img class="wanna-change" src="something" />
  <img class="wanna-change" src="something-else" />
</body>
</html>

另一方面,我不会使用 javascript 来做到这一点,我会像这样从 css 做到这一点:

img {
    your-normal-style;
}
img:hover {
    your-hover-style;
}
img.searching {
    your-searching-style;
}

并将那段 jQuery 更改为只捕获点击,执行搜索 AJAX 调用,然后

$(this).addClass("searching");

并且可能

$(this).removeClass("searching");

搜索完成时

于 2011-08-26T17:14:10.493 回答