0

我有一个 PHP 页面,它有 3 个 JavaScript 函数,并使用带有“onclick”的图像映射来更改图像和地图坐标,以便 onclick 运行下一个函数。

到目前为止,我的代码一直运行到最后一个函数的最后一个图像——我理解。我想要实现的是在新坐标中一次单击一个之后调用的函数。

如果每个函数的调用时间有时间限制,则可以 - 但在该时间限制之前,onclick 可以运行下一个函数:

    <img src=<?php echo 'image-start.jpg' ?> width="700" height="400" 
    usemap="#start" class="map" style="border-style:none; margin:0" id="imageX" />


    <map id="start" name="start">
    <area shape="poly"  id="A"  class=""  title="Click to Start"  onclick="myFunction_1()" 
        coords=<?php echo '"'; echo $coords_0; echo '"' ; ?>/>
    <area shape="poly"  id="B"  class=""  title="Click to Start"  onclick="myFunction_1()" 
        coords=<?php echo '"'; echo $coords_0; echo '"' ; ?>/>
    </map>



    <script>
    function myFunction_1() {
         document.getElementById("imageX").src=" <?php echo 'image_1.jpg' ?>  " ;

         document.getElementById("A").coords= <?php echo '"'; echo $coords_1_a; echo '"' ; ?> ;
         document.getElementById("A").onclick= myFunction_2() ;

         document.getElementById("B").coords= <?php echo '"'; echo $coords_1_b; echo '"' ; ?> ;
         document.getElementById("B").onclick= myFunction_2() ;
         }

    function myFunction_2() {
         document.getElementById("imageX").src=" <?php echo 'image_2.jpg' ?>  " ;

         document.getElementById("A").coords= <?php echo '"'; echo $coords_2_a; echo '"' ; ?> ;
         document.getElementById("A").onclick= myFunction_3() ;

         document.getElementById("B").coords= <?php echo '"'; echo $coords_2_b; echo '"' ; ?> ;
         document.getElementById("B").onclick= myFunction_3() ;
         }

    function myFunction_3() {
         document.getElementById("imageX").src=" <?php echo 'image_end.jpg' ?>  " ;
         }
    </script>
4

1 回答 1

1

您可以使一个函数在延迟后触发另一个函数setTimeout()-- 例如,将以下代码添加到 myFunction_1 将导致 myFunction_2 在 5 秒(5000 毫秒)内运行

setTimeout(myFunction_2, 5000)
于 2013-02-22T05:51:24.650 回答