Při programování v javascriptu v podstatě čelíme nějaké situaci, ve které můžeme po kliknutí na tlačítko vytvořit libovolnou funkci. Musíme například prověřit některé další funkce v době testování automatizace webové stránky nebo webu. V takových případech se technika spouštění události kliknutí javascriptu stává spolehlivější a účinnější pro řešení uvedených problémů.
V této souvislosti se seznámíme s procedurami události trigger click v javascriptu.
Jak můžeme spustit událost kliknutí v javascriptu:
Ke spuštění události kliknutí v javascriptu musíme použít níže uvedené techniky:
a) metoda click().
b) metody addEventListener() a dispathEvent
Nyní použijeme metody, které byly napsány výše, abychom demonstrovali následovně:
Metoda 1:
Spustit událost kliknutí pomocí metody události kliknutí v javascriptu:
Na zmíněném prvku, klikací metoda se používá k provedení akce. Pomocí uživatelsky definované funkce, kdy uživatel klikne na požadované tlačítko pomocí vytvoření tlačítka, získání jeho id a spuštění události kliknutí, lze tuto metodu implementovat.
Pro další objasnění si musíme projít příklad uvedený níže:
Příklad:
V níže uvedeném příkladu s have 'klikněte zde' , vytvoří se tlačítko s id a spolu s událostí kliknutí pro přístup k události kliknutí na něm;
Click here
Zadáním jeho id v javascriptu musíme k vytvořenému tlačítku přistupovat v metodě document.getElementById. K provedení další operace bude vyvolána událost click.
const get= document.getElementById('btn'); get.click();
Nakonec po kliknutí na tlačítko definujeme k vytištění následující pojmenovanou funkci 'clickEvent()' způsobem, že na konzole pomocí metody kliknutí.
function clickEvent() { console.log('now the Click Event is triggered ') } Z výše uvedeného výstupu příslušného kódu pomocí automatizované metody kliknutí jsme vypozorovali, že se kliklo na tlačítko klikněte sem.
Metoda 2:
Spustit událost kliknutí v javascriptu pomocí metod addEventListener() a dispatchEvent()
V javascriptu je to integrální metoda, kterou poskytuje rozhraní cíle události javascript.
Touto metodou je registrován posluchač událostí. Naši nakonfigurovanou funkci zavoláme, když je zmíněná událost zachycena na cíli.
Syntaxe události:
target.addEventListener( $type, $listener); target.addEventListener( $type, $listener, $options); target.addEventListener( $type, $listener, $useCapture);
popis syntaxe:
- Ve výše uvedené syntaxi je parametr nazvaný $typ , což je povinný parametr. Parametry udávající typ sledované události akceptují pouze jeden řetězec. Tento parametr rozlišuje malá a velká písmena. Podporuje různé události, jako je klávesnice, kliknutí, databáze, vstup atd
- Stejným způsobem, $posluchač je povinný parametr i v něm. Oznámení o události je tímto parametrem přijímáno jako objekt, když nastala událost uvedeného typu. Na funkci javascript nebo na rozhraní Eventlistner by měl být tento objekt implementován.
- Na druhou stranu, $option je volitelný parametr v něm.
Příklad: 1
Open bing const link = document.getElementById('btn'); link.addEventListener('click', e => {}); for(let i = 0; i <5; i++) { link.dispatchevent(new event('click')); } function opengooglebymethod() console.log('the required event is triggered') < pre> <p> <strong>Output:</strong> </p> <pre> 'The required event is triggered'. 'The required event is triggered'. 'The required event is triggered'. 'The required event is triggered'. 'The required event is triggered'. </pre> <p> <strong>Example 2:</strong> </p> <p>In this example, first of all, we will include a button with a corresponding id with an onclick event along with a value as same as like previous one.</p> <pre> Click here </pre> <p>After that, with the help of the <strong> <em>addEventListener()</em> </strong> method, we will retrieve the button and click the event in it to specify the <strong> <em>'e'</em> </strong> in its argument, which refers to the event click object.</p> <pre> const get = document.getElementById('btn'); get.addEventListener('click', e => {}); get.dispatchEvent(new Event('click')); </pre> <p>Finally, as same as the previous method, we will define the click event to display the corresponding message in it at the time the click event is triggered.</p> <pre> function clickEvent() { console.log('The required event is triggered ') } </pre> <hr></5;> Příklad 2:
V tomto příkladu nejprve zahrneme tlačítko s odpovídajícím id s událostí onclick spolu s hodnotou stejnou jako předchozí.
Click here
Poté s pomocí addEventListener() způsob, načteme tlačítko a kliknutím na událost v něm specifikujeme 'To je' ve svém argumentu, který odkazuje na objekt kliknutí události.
const get = document.getElementById('btn'); get.addEventListener('click', e => {}); get.dispatchEvent(new Event('click')); Nakonec, stejně jako v předchozí metodě, definujeme událost kliknutí tak, aby se v ní zobrazila odpovídající zpráva v okamžiku, kdy je událost kliknutí spuštěna.
function clickEvent() { console.log('The required event is triggered ') }