Question

单击图像时，我必须更改图像源。问题是图像仅在执行函数期间更改，但在!!!之后立即恢复为其初始值

这是我到目前为止所做的：

<head>
<title></title>
<script type="text/javascript">
    function cardMouseClick(obj) {
        el = document.getElementById(obj);
        el.src = "image2.jpg";
    alert("Hello!");        
    }
</script>
</head>
<body>
<form id="form1">
   <input type="image" id="b1" src="image1.jpg"  
      onclick="cardMouseClick('b1')"/>

</form>
</body>

图像2正常显示，同时警告弹出窗口等待用户单击确定。然后它恢复为image1！

为什么？

Answer 1

因为它提交了表格。来自return的{{1}} false。

Answer 2

您必须阻止重新加载页面：

<form id="form1">
   <input type="image" id="b1" src="image1.jpg"  
      onclick="cardMouseClick('b1'); return false;"/>
</form>

Answer 3

你可以这样做。

        <head>
        <title></title>
        <script type="text/javascript">
              function cardMouseClick(obj) {
                    el = document.getElementById(obj);
                    el.src = "image2.jpg";
                    alert("Hello!");
                    return false;          
                   }
        </script>
       </head>
       <body>
       <form id="form1">
          <input type="image" id="b1" src="image1.jpg"  
            onclick="cardMouseClick('b1')"/>
       </form>

JavaScript更改图像源不会持久化

3 个答案: