如何在單個函數中定義多個任務並在javascript中使用

Question

<div id="demo" onclick="tasks("fade")"> 
    <div id="demo" onclick="tasks("glow")"> 
    <div id="demo" onclick="tasks("slide")"> 
     <script> 
     function tasks(){ 
      fade = do fade; 
      glow = make glows; 
      slide = move slide; 
     } 
     </script> 

如何使用單個函數並聲明多個任務並使用它們像上面創建的特定元素？

Answer 1

你可以這樣做，雖然它可以用許多其他方式完成。

function tasks(action){ 
 
if(action === "fade"){ 
 
    console.log("Handle fade action here"); 
 
} 
 
else if(action === "glow"){ 
 
    console.log("Handle glow action here"); 
 
} 
 
else if(action === "slide"){ 
 
    console.log("Handle slide action here"); 
 
} 
 
}

<div id="demo" onclick="tasks('fade')">fade</div> 
 
<div id="demo" onclick="tasks('glow')">glow</div> 
 
<div id="demo" onclick="tasks('slide')">slide</div>

使用switch：

function tasks(action){ 
 
    switch(action){ 
 
    
 
    case "fade": console.log("Fade action here"); 
 
        break; 
 
     
 
    case "glow": console.log("Glow action here"); 
 
        break; 
 
     
 
    case "slide": console.log("Slide action here"); 
 
        break; 
 
     
 
     
 
    default :console.log("any other actions here") 
 
    
 
    
 
    } 
 
    
 
}

<div id="demo" onclick="tasks('fade')">Fade</div> 
 
<div id="demo" onclick="tasks('glow')">Glow</div> 
 
<div id="demo" onclick="tasks('slide')">Slide</div> 
 
<div id="demo" onclick="tasks('any other')">any other</div> 
 
    
 

Answer 2

您可以使用變量，它在你的函數可用：

<script> 
function tasks(effect){ 
switch(effect){ 
    case "fade": 
    // execute some code here; 
    break; 
    case "glow": 
    // execute some code here; 
    break; 
    case "slide": 
    // execute some code here; 
    break; 
} 
    } 
</script>