ForgeComponenten
nl

Componenten

j-Exec

jComponent 20 · jcomponent@20 component Voorbeeld geladen met jComponent 20

De component uitvoert een methode wanneer de gebruiker op hetzelfde element klikt met de exec, exec2, of exec3 klasse.

Elementen:

  • Elementen kunnen een data-exec-attribut bevatten met een methodenaam die wordt uitgevoerd wanneer de gebruiker op het element klikt.
  • De elementen kunnen de data-href-attribuut bevatten en de component uitvoert de REDIRECT().

Attributen:

  • data-exec="METHOD_NAME" uitvoert een methode wanneer de gebruiker klikt (de plug-in oproepen ondersteunt via het karakter ?)
  • data-prevent="true" voorkomt voortzetting in het evenement click
  • data-href="URL" werkt met REDIRECT()

Attributen voor de dubbele klik:

  • data-exec2="METHOD_NAME" uitvoert een methode wanneer de gebruiker klikt (de plug-in oproepen ondersteunt via het karakter ?)
  • data-prevent2="true" voorkomt voortzetting in het evenement click
  • data-href2="URL" werkt met REDIRECT()

Aantrekkingen voor het contextuele menu:

  • data-exec3="METHOD_NAME" uitvoert een methode wanneer de gebruiker klikt (de plug-in oproepen ondersteunt via het karakter ?)
  • data-href3="URL" werkt met REDIRECT()

Goed om te weten:

  • de component uitvoert een doelfunctie in de vorm function(element, event)
  • data-exec=, data-exec2=, data-exec3= kan @METHOD_NAME bevatten die zal worden uitgevoerd in de huidige component plug-in oproepen component/METHOD_NAME(element, e)

Nieuw: Uitbreiding:

SETTER('exec/register', function(exec, el, e, type) {

	// @exec {String} a value from data-exec
	// @el {jQuery element}
	// @e {Event}
	// @type {String} empty '': click, '2': double-click '3': context menu
	// registers a new extension

	if (exec.charAt(0) === '/') {

		EXEC('customplugin/' + exec.substring(1), el, e);

		// "return true" stops the next processing of Exec
		return true;

	}

});

Gebruik het met <ui-component name="exec">Wanneer de component nog niet is geladen, jComponent Download het op eerste gebruik van het adres in DEF.fallback (De Componentator Schrijver: Peter Širka. bron: de Componentator Componenten repository, MIT licentie.

example.html
<ui-component name="exec"></ui-component>
<a href="javascript:void(0)" class="exec" data-exec="myClick">1</a>
<a href="javascript:void(0)" class="exec" data-exec="myClick">2</a>
<p class="exec" data-exec="myClick">3</p>
<span class="exec" data-exec="myClick">4</span>
<div class="exec" data-exec="myClick">5</div>

<script>
	function myClick(el) {
        alert('CLICK: ' + el.html());
    }
</script>