Question

我有一个（简单）问题：当我点击html页面上的图片时，是否可以做2个不同的操作？有没有例子可以解释一下？

提前致谢

Answer 1

当然这很容易。

document.getElementById("myPic").addEventListener("click", function(e){
    doActionOne();
    doActionTwo();
});

Answer 2

您可以使用jQuery或普通的javaScript在附加到图片的onclick事件中同时执行操作例如，在jQuery中，＃myImg是图像的id：

HTML图片代码：

<img id ="myImg" alt="image" src="someImg.png">

jQuery代码： https://api.jquery.com/click/

 <script src="https://code.jquery.com/jquery-1.10.2.js"></script>
 <script type="text/javascript">

        (function ($) {
            $(window).load(function () {
                $("#myImg").click(function () {
                   //Change source of the image
                   $(this).attr( "src", "anotherimage.png" );
                    // Do something else here...
                });

            });
        })(jQuery);

    </script>

使用普通的javaScript：

<script type="text/javascript">
 window.onload = function() {
   document.getElementById('myImg').addEventListener('click', function (e) {
     //Change source of the image
      this.setAttribute('src', 'anotherimage.png');
     // Do something else here...
   });
 };
</script>

我们可以用js＆amp; amp; HTML

2 个答案: