Autor Zpráva
jrw
Profil
#1 · Zasláno: 5. 10. 2006, 20:53:30
Odpovědět Citovat
Nazdar vespolek, mám takovou jednoduchou funkci která vcelku moc nedělá jenom mění barvu textu v reakci na onclick ale příjde mi že by se to dalo napsat jednodušej. Bohužel nevím jak. Nevíte někdo jak by se to dalo napsat nějak jinak?

Díky

<script type="text/javascript" language="JavaScript">
<!--

function blok_1(co_1, barva_1, co_2, barva_2, co_3, barva_3){
document.getElementById(co_1).style.color = barva_1;
document.getElementById(co_2).style.color = barva_2;
document.getElementById(co_3).style.color = barva_3;
}

//-->
</script>

<div id="box_1" onclick="blok_1('box_11', 'red', 'box_22', 'silver', 'box_33', 'silver')">
<p id="box_11">Lorem ipsum dolor sit amet.</p>
</div>

<div id="box_2" onclick="blok_1('box_22', 'red', 'box_11', 'silver', 'box_33', 'silver')">
<p id="box_22">Lorem ipsum dolor sit amet.</p>
</div>

<div id="box_3" onclick="blok_1('box_33', 'red', 'box_11', 'silver', 'box_22', 'silver')">
<p id="box_33">Lorem ipsum dolor sit amet.</p>
</div>
tiso
Profil
#2 · Zasláno: 5. 10. 2006, 21:05:45
Odpovědět Citovat
Parametre farby i všetky elementy si hoď do tej funkcie, stačí Ti jeden parameter - prvok ktorý meníš, prípadne po menšej úprave sa dá použiť "this".
jrw
Profil
#3 · Zasláno: 5. 10. 2006, 21:08:00
Odpovědět Citovat
Mě to teď nějak nezapaluje, nebyl by příklad?
taui
Profil *
#4 · Zasláno: 6. 10. 2006, 16:07:21
Odpovědět Citovat
jak by ne:
function zmen_barvu_textu(id,barva){
document.getElementById(id).style.color=barva;
}
a volej onclick="zmen_barvu_textu('box_11', 'red');zmen_barvu_textu('box_22', 'silver');zmen_barvu_textu('box_33', 'silver')" no vydis a hned to muzes vyuzit na jakekoliv nastaveni barvy textu
A pokud menis tuto barvu casto a jen na trech boxech tak je zbytecne se porad znovu dotazovat.uloz si document.getElementById do pole treba takto
boxy={"box1":document.getElementById("box_11"),"box2":document.getElem entById("box_22")}
a funkci takto
function zmen_barvu_textu(kterybox,barva){
boxy[kterybox].style.color=barva;
}
a zarid si to podle sebe protoze ja houby vim k cemu to mas
los
Profil *
#5 · Zasláno: 6. 10. 2006, 18:04:59
Odpovědět Citovat
Ten navrhovaný kód je od toho pôvodného krokom dozadu. Ja by som to robil trochu úplne inak. Ak som tomu správne pochopil, tak to má slúžiť na zvýraznenie odstavca, na ktorý používateľ klikne a tie elementy div sú tam len (!) kvôli tomu, aby odchytili udalosť click.

Takže v prvom rade by som vyhodil všetky zbytočnosti z HTML a zostalo by: 
<p>Lorem ipsum dolor sit amet.</p>

<p>Lorem ipsum dolor sit amet.</p>

<p>Lorem ipsum dolor sit amet.</p>


Do pripojeného súboru s JavaScriptom by som dal: 
var Focus =

{

	el: null,

	

	click: function ()

	{

		if (Focus.el)

			Focus.el.className = Focus.el.className.replace (/(^|\s)focused(\s|$)/g, "");

		

		Focus.el = this;

		Focus.el.className += " focused";

	},

	

	setup: function (els)

	{

		for (var i = 0; i < els.length; ++i)	

			els [i].onclick = Focus.click;

	}

};



window.onload = function ()

{

	Focus.setup (document.getElementsByTagName ("p"));

}


Do pripojeného súboru so štýlmi by som dal: 
.focus { background: yellow; }


Výhodou je (okrem toho, že zmiznú zbytočné elementy z HTML) to, že teraz sa môžu do HTML pridať ďalšie stĺpce a kód JavaScriptu nemusíš meniť. Ak nechceš zvýrazňovať všetky odstavce, stačí mierne zmeniť inicializáciu. Najväčšou výhodou je to, že sú od seba úplne oddelené obsah, správanie a výzor.
los
Profil *
#6 · Zasláno: 6. 10. 2006, 18:06:10
Odpovědět Citovat
Tá trieda v CSS má byť samozrejme focused, ale princíp je snáď jasný.
Časová prodleva: 19 let
Toto téma je uzamčeno. Odpověď nelze zaslat.

0