Php 使用onclick运行函数

我有一个PHP页面，它有3个JavaScript函数，并使用带有“onclick”的图像映射来更改图像和映射坐标，以便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>

width=“700”height=“400”
usemap=“#start”class=“map”style=“边框样式：无；边距：0”id=“imageX”/
/>
函数myFunction_1（）{
document.getElementById（“imageX”）.src=“”；
document.getElementById（“A”）.coords=；
document.getElementById（“A”）.onclick=myFunction_2（）；
document.getElementById（“B”）.coords=；
document.getElementById（“B”）.onclick=myFunction_2（）；
}
函数myFunction_2（）{
document.getElementById（“imageX”）.src=“”；
document.getElementById（“A”）.coords=；
document.getElementById（“A”）.onclick=myFunction_3（）；
document.getElementById（“B”）.coords=；
document.getElementById（“B”）.onclick=myFunction_3（）；
}
函数myFunction_3（）{
document.getElementById（“imageX”）.src=“”；
}

您可以使用

setTimeout（）

使一个函数在延迟后触发另一个函数——例如，将以下代码添加到myFunction_1将使myFunction_2在5秒（5000毫秒）内运行

---

仅供参考，代码

可以简化为

“

”。这将使事情更容易阅读。我尽可能避免服务器代码与客户端代码混合。它变得难以读取、维护和缩放。将客户端逻辑移出服务器模板将使新功能更易于实现和调试。@DavidKiger使用短标记可以，但这取决于服务器是否打开了它们或它们根本无法工作。谢谢@mike的帮助，是的，这非常有用，谢谢Ted

setTimeout(myFunction_2, 5000)