Как запустить более одной функции JavaScript одним щелчком мыши

ProgramBox

Как запустить более одной функции JavaScript одним щелчком мыши

Post author:admin
Запись опубликована:13 мая, 2023
Post category:Вопросы по программированию

#javascript

Вопрос:

Как мне запустить пять функций JavaScript одним щелчком мыши?

Пример кода:

 <img alt="move right" 
     src="Pictures/sides/right.gif" 
     id="MoveRight" 
     ***onclick="javascript:moveObjRight('ground','sky','mountain');"***
     style="z-index: 1; left: 801px; top: 37px; position: absolute; height: 33px; width: 34px;" 
/>

Ответ №1:

 <img alt="move right" src="Pictures/sides/right.gif" id="MoveRight"
    onclick="moveObjRight('ground','sky','mountain');myFunction2();myFunction3();myFunction4();myFunction5();"
    style="z-index: 1; left: 801px; top: 37px; position: absolute; height: 33px;
    width: 34px;" />

или

 <script type="text/javascript">
window.onload = function() {
    var ele = document.getElementById('MoveRight');
    ele.onclick = function() {
        moveObjRight('ground','sky','mountain');
        myFunction2();
        myFunction3();
        myFunction4();
        myFunction5();
    }
};
</script>

Обратите внимание, что второй вариант переопределит любую ранее назначенную функцию window.onload and ele.onclick . Если вы используете библиотеку javascript, используйте соответствующее событие dom ready (например, jQuery: $(document).ready(function(){/*code*/}); или short: $(function(){/*code*/}) )

1. @Thomas MyFunction2() будет вызываться только после moveObjRight(..), верно? Есть ли какой-либо способ вызвать все функции асинхронно?

2. возможно ли запускать функции в потоковом режиме, я имею в виду, что все функции выполняются одновременно, а не по очереди?

3. не совсем, помните, что все движки javascript (о которых я знаю) запускают javascript синхронно — даже когда выполняется функция события, такая как onclick, весь другой javascript на этой странице останавливается.

4. не совсем, пока вы теряете контроль над тем, когда она запускается, она никогда не будет выполнять 2 функции одновременно. setTimeout настоящая цель — запустить функцию позже (кстати. обратите внимание, что не гарантируется, что она будет запущена точно через указанное время / миллисекунды).

5. Javascript является однопоточным , вы не можете запускать функции асинхронно. Вы можете запускать XMLHttpRequests асинхронно, но когда они вернутся, их функции обратного вызова будут помещены в очередь и выполняться в свою очередь. setTimeout позволяет запускать функции через некоторый интервал, но не обеспечивает какого-либо асинхронного поведения.

Ответ №2:

Вы можете добавить все свои функции в свойство onclick тега img

 <img onclick="fnc1();fnc2();..." />

Ответ №3:

Вы можете вызвать один метод в вашем событии on click, и в этом методе вы можете вызвать все ваши другие методы.

Ответ №4:

Вызов нескольких функций в другой функции

 <script type="text/javascript">
   function CallMultipleFunctions() {
     Function1();
     Function2();
     Function3();
     Function4();
}
</script>

<img onclick= "CallMultipleFunctions()"/>

Редактировать:

Проверьте эту ссылку

1. возможно ли запускать функции в потоковом режиме, я имею в виду, что все функции выполняются одновременно, а не по очереди?

2. По всем соображениям программирования Javascript является однопоточным, [1] однако, поскольку модель веб-браузера однопоточная, все четыре функции будут запущены до того, как пользователь вернет себе управление. Вам нужно сказать, почему вам нужно что-то другое, прежде чем мы сможем посоветовать вам другие решения. [1] Да, есть веб-работники, но они не могут взаимодействовать с пользовательским интерфейсом, поэтому я их игнорирую.