Question

我正在尝试创建一个旋转木马，其中每个图像都有一个onmouseover来改变图像，使用来自W3学校的代码，由于某种原因图片没有改变

<div class="carousel-inner top-right" role="listbox">
    <div class="item active">
      <a href="#" onmouseover="document.getElementById('PhotoInfo1').src='/home/pranay/Documents/V1/V1/Pictures/PhotoInfo1.jpg';"
      onmouseout="document.getElementById('Photo1').src='/home/pranay/Documents/V1/V1/Pictures/Photo1.jpg';">
      <img src="/home/pranay/Documents/V1/V1/Pictures/Photo1.jpg" id="1" />
    </a>
  </div>

这与仅轮播的所有项目的图像名称的更改相同。任何人都知道为什么会发生这种情况，顺便说一句，我已经尝试过另一篇文章中的getElement

编辑：所以我改变了那里的图像的id，新代码为`
哪个仍然无法工作，所以我做了这个

  <div class="carousel-inner" role="listbox">
    <div class="item active">
      <a href="#" onmouseover="document.getElementById('PhotoInfo1').src='/home/pranay/Documents/V1/V1/Pictures/PhotoInfo1.jpg';"
      onmouseout="document.getElementById('Photo1').src='/home/pranay/Documents/V1/V1/Pictures/Photo1.jpg';">
      <img  src="/home/pranay/Documents/V1/V1/Pictures/Photo1.jpg" id="Photo1" />
    </a>
  </div>

仍然无法正常工作，可能是因为PhotoInfo1没有标签所以我这样做了：

  <div class="carousel-inner" role="listbox">
    <div class="item active">
      <a href="#" onmouseover="document.getElementById('PhotoInfo1').src='/home/pranay/Documents/V1/V1/Pictures/PhotoInfo1.jpg';"
      onmouseout="document.getElementById('Photo1').src='/home/pranay/Documents/V1/V1/Pictures/Photo1.jpg';">
      <img  src="/home/pranay/Documents/V1/V1/Pictures/Photo1.jpg" id="Photo1" />
      <img  src="/home/pranay/Documents/V1/V1/Pictures/PhotoInfo1.jpg" id="PhotoInfo1" />
    </a>
  </div>

现在向我显示了2张图片，其中一张照片在滚动时发生了变化但在鼠标输出时没有变化，第二张图像没有变化。我还尝试在第二张图像的其他地方分配一个ID，但这没有变化的情况。

我现在该怎么办？

我只是尝试了一些随机的事情，我想到了当我使用这段代码时的事实：

  <div class="carousel-inner" role="listbox">
    <div class="item active">
      <a href="#" onmouseover="document.getElementById('PhotoInfo1').src='/home/pranay/Documents/V1/V1/Pictures/PhotoInfo1.jpg';"
      onmouseout="document.getElementById('Photo1').src='/home/pranay/Documents/V1/V1/Pictures/Photo1.jpg';">
      <img src="/home/pranay/Documents/V1/V1/Pictures/Photo1.jpg" id="PhotoInfo1" />
    </a>
  </div>

我将照片从photo1更改为photoinfo1（实际照片不是ID），但没有切换回photo1。所以会发生的事情是我在页面加载时看到photo1，在我将鼠标放在它上面之后它会变为第二张图片，但在我滚动时不会切换回第一张图片。

为什么现在发生这种情况？

好的，所以这是让它起作用的代码（sorta是freefaller所说的），但我仍然有点困惑，为什么会发生这种情况你能解释一下吗？

<div class="carousel-inner" role="listbox">
    <div class="item active">
      <a href="#" onmouseover="document.getElementById('PhotoInfo1').src='/home/pranay/Documents/V1/V1/Pictures/PhotoInfo1.jpg';"
      onmouseout="document.getElementById('PhotoInfo1').src='/home/pranay/Documents/V1/V1/Pictures/Photo1.jpg';">
      <img src="/home/pranay/Documents/V1/V1/Pictures/Photo1.jpg" id="PhotoInfo1" />
    </a>
  </div>

Answer 1

在我看来，你正在引用错误的元素 - 你的链接指的是ids＆＃39; PhotoInfo1＆＃39;和＆＃39; Photo1＆＃39;而你想要改变的img的ID是＆＃34; 1＆＃34;。

请改为尝试：

<div class="carousel-inner top-right" role="listbox">
    <div class="item active">
        <a href="#" onmouseover="document.getElementById('1').src='/home/pranay/Documents/V1/V1/Pictures/PhotoInfo1.jpg';" onmouseout="document.getElementById('1').src='/home/pranay/Documents/V1/V1/Pictures/Photo1.jpg';">
        <img src="/home/pranay/Documents/V1/V1/Pictures/Photo1.jpg" id="1" />
        </a>
    </div>
</div>

希望这有帮助

Answer 2

您正在document.getElementById和mouseover处理程序的mouseout中查找不同的元素。您的mouseout代码找不到名为Photo1的元素。

将mouseout改为使用PhotoInfo1而不是Photo1。

即。改变这个......

<a href="#" onmouseover="document.getElementById('PhotoInfo1').src='/home/pranay/Documents/V1/V1/Pictures/PhotoInfo1.jpg';"
  onmouseout="document.getElementById('Photo1').src='/home/pranay/Documents/V1/V1/Pictures/Photo1.jpg';">

对此（^^^向您显示更改）...

<a href="#" onmouseover="document.getElementById('PhotoInfo1').src='/home/pranay/Documents/V1/V1/Pictures/PhotoInfo1.jpg';"
  onmouseout="document.getElementById('PhotoInfo1').src='/home/pranay/Documents/V1/V1/Pictures/Photo1.jpg';">
                                       ^^^^^^^^^^

Answer 3

onmouseover =＆＃34; this.setAttribute（＆＃39; scrollamount＆＃39;，0,0）;＆＃34;

onmouseout =＆＃34; this.setAttribute（＆＃39; scrollamount＆＃39;，6,0）;＆＃34;＆gt; Hello Whats is is on

onmouseover没有使用chrome？

3 个答案: