j-Selected

jComponent 20 · jcomponent@20 component Příklad načten s jComponent 20

Komponenta může nastavit konkrétní třídu na konkrétní prvek podle jednoduchého stavu.

Konfigurace:

class {String} je třídní název pro vybraný prvek (předvolený: selected)
selector {String} je jQuery selektor (předvolený: a)
Příslušenství pro srovnání attr {String} (předvolené: if a znamená data-if)
attror {String} pro sekundární srovnání (předvolené: or a znamená data-or)
datasource {String} cesta k zdroji dat pro seznam položek
delay {Number} zpoždění při výběru hodnoty (předvolené: 50)

Použití:

Každý nátěr podle selector musí mít definovaný atribut data-if a funguje pouze s hodnotami strings.

Použijte ji s <ui-component name="selected">Pokud je součástka ještě nezačleněna, jComponent Stáhnout ji na první použití z adresy DEF.fallback a) The Componentator CDN dle předvolby. autor: Peter Širka. zdroj: Componentator Výrobce je autorizován, MIT licence.

example.html

<style>
	.selected { font-weight: bold; }
	nav a { display: block; }
</style>

<nav>
	<ui-component name="selected" path="common.page">
		<a href="#users" data-if="users">Users</a>
		<a href="#products" data-if="products">Products</a>
		<a href="#settings" data-if="settings">Settings</a>
	</ui-component>
</nav>

<script>

	SET('common.page', 'products');

	window.onhashchange = function() {
		SET('common.page', location.hash.substring(1));
	};

</script>