Fatal编程技术网
  • javascript/
  • JavaScript更改图像源未持久化

JavaScript更改图像源未持久化

javascript image

JavaScript更改图像源未持久化,javascript,image,Javascript,Image,单击图像时，我必须更改图像源。 问题是图像仅在函数执行过程中更改，但在执行后立即恢复到其初始值 这就是我到目前为止所做的： <head> <title></title> <script type="text/javascript"> function cardMouseClick(obj) { el = document.getElementById(obj); el.src = "image2.jpg";

单击图像时，我必须更改图像源。 问题是图像仅在函数执行过程中更改，但在执行后立即恢复到其初始值

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

<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>


功能卡鼠标单击（obj）{
el=document.getElementById（obj）；
el.src=“image2.jpg”；
警惕（“你好！”）；
}
当警报弹出窗口等待用户单击“确定”时，将适时显示图像2。 然后它会返回到图1

为什么？

因为它正在提交表单
返回
错误
从
cardMouseClick（…）
必须防止页面重新加载：

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

        <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>


功能卡鼠标单击（obj）{
el=document.getElementById（obj）；
el.src=“image2.jpg”；
警惕（“你好！”）；
返回false；
}
这很奇怪：Joseph Silber的解决方案很好用，而你的解决方案却不行！我想知道为什么？谢谢你的及时回答：-）