在onclick事件中调用多个JavaScript函数

给定多个函数，任务是使用JavaScript的一个 onclick事件 只调用它们中的一个。这里讨论了几种方法。

我们可以通过在发生onclick事件的元素上提及它们的名称来调用它们，或者首先调用一个单独的函数，然后在该函数内调用所有其他函数。

示例1： 这个示例通过在 onclick事件 中提及它们的名称来调用两个函数，使用分号“;”分隔。

<!DOCTYPE html>
<html>
<head>
    <title>
        Call multiple JavaScript functions
        in onclick event
    </title>
</head>
 
<body>
    <h1 style="color:green;">
        GeeksforGeeks
    </h1>
    <p id="GFG_UP">
    </p>
 
    <button onclick="GFG_Fun_1(); GFG_Fun_2()">
        click here
    </button>
    <p id="GFG_DOWN_1">
    <p id="GFG_DOWN_2">
    </p>
 
    <script>
        let up = document.getElementById('GFG_UP');
        up.innerHTML =
            'Click on the button to call multiple functions';
        let down_1 = document.getElementById('GFG_DOWN_1');
        let down_2 = document.getElementById('GFG_DOWN_2');
 
        function GFG_Fun_1() {
            down_1.innerHTML = 'From function 1';
        }
 
        function GFG_Fun_2() {
            down_2.innerHTML = 'From function 2';
        }
    </script>
</body>
</html>

输出：

在onclick事件中调用多个JavaScript函数

示例2： 此示例首先调用一个函数，现在由该函数负责调用其他函数。此示例执行相同操作。

<!DOCTYPE html>
<html>
<head>
    <title>
        Call multiple JavaScript functions
        in onclick event
    </title>
</head>
 
<body>
    <h1 style="color:green;">
        GeeksforGeeks
    </h1>
    <p id="GFG_UP">
    </p>
 
    <button onclick="GFG_Fun(); ">
        click here
    </button>
    <p id="GFG_DOWN_1">
    <p id="GFG_DOWN_2">
    </p>
 
    <script>
        let up = document.getElementById('GFG_UP');
        up.innerHTML =
            'Click on the button to call multiple functions';
        let down_1 = document.getElementById('GFG_DOWN_1');
        let down_2 = document.getElementById('GFG_DOWN_2');
 
        function GFG_Fun() {
            GFG_Fun_1();
            GFG_Fun_2();
        }
 
        function GFG_Fun_1() {
            down_1.innerHTML = 'From function 1';
        }
 
        function GFG_Fun_2() {
            down_2.innerHTML = 'From function 2';
        }
    </script>
</body>
</html>

输出：

在onclick事件中调用多个JavaScript函数