| Autor | Zpráva | ||
|---|---|---|---|
| Joan Profil |
#1 · Zasláno: 3. 8. 2010, 12:29:04 · Upravil/a: Joan
Objevuji souvislosti a "gramatiku" spojení Javascriptu a stylování a
1) mám dva velmi podobné kódy: <script language="JavaScript" type="text/javascript"><!--
for (i=1; i<14; i++) //vypisou se cernou barvou licha a cervene suda cisla od 1
{
document.write([i]+" ");
if(i++)
{
document.write("<b style='color: red;'>"+ [i]+ " </b>");
}
}//-->
</script>Vše se vypíše správně, jak chci, tj. střídá se černá lichá číslice s červenou sudou V druhém kódu je jediná změna:
<script language="JavaScript" type="text/javascript"><!--
for (i=0; i<14; i++) //vypisou se cerne suda a cervene licha cisla od 0 krome 1...proc?
{
document.write([i]+" ");
if(i++)
{
document.write("<b style='color: red;'>"+ [i]+ " </b>");
}
}
//-->
</script>a vypíšou se sice správně černá sudá čísla, červeně lichá, ale číslice 1 se z mně neznámého důvodu vynechá. Proč? 2) Chci, aby se kliknutím na všechny odstavce (ne naráz, postupným klikáním) změnilo a) jejich formátování uvedené ve funkci b) abych mohla některou vlastnost vynechat - když jsem v druhém odstavci vynechala v události onclick (hodnotu? nebo vlastnost?) "bold" tak konzola hlásila "chyba při parsování hodnoty vlastnosti 'font-weight'. Deklarace vynechána". Nebo si té hlášky nemusím všímat? Zatím umím změnit pouze první odstavec, protože mám ve funkci deklarováno jeho ID. Ale já chci funkci rozšířit na všechny odstavce v textu, bez ohledu na jejich konkrétní ID. var id = document.getElementById; jsem zjistila že nefunguje. Prosím o pošťouchnutí ;-)
<head>
<script language="JavaScript" type="text/javascript"><!--
function zmena(barva, pozadi, tucnost)
{
document.getElementById("prvni").style.color = barva;
document.getElementById("prvni").style.backgroundColor = pozadi;
document.getElementById("prvni").style.fontWeight = tucnost;
}
//-->
</script>
</head>
<body>
<p id="prvni" onclick="zmena('yellow', 'blue', 'bold');">Změny v prvním odstavci pomocí funkce</p>
<p id="druhy" onclick="zmena('grey', 'green');">Změny v druhém odstavci pomocí funkce</p>
</body> |
||
| Kajman_ Profil * |
#2 · Zasláno: 3. 8. 2010, 12:37:29
1)
v if(i++) testujete při prvním průchodu číslo 0 - což je nepravda 2) Zkuste místo vynechání zapsat parametr jako '' (a předejte si jako parametr funkce zmena this a pak ho použitje místo document.getElement) |
||
| Joan Profil |
#3 · Zasláno: 3. 8. 2010, 13:09:38
Kajman:
v if(i++) testujete při prvním průchodu číslo 0 - což je nepravda Proč by posloupnost čísel nemohla začínat nulou? ad 2) začíná mi svítat, díky! |
||
| Kajman_ Profil * |
#4 · Zasláno: 3. 8. 2010, 13:23:23
Proč by posloupnost čísel nemohla začínat nulou?
Nikdo neříká, že nemůže. Jen tam vypisujete druhé číslo, jen když první vyjde v podmínce if kladně, což číslo 0 nevyjde. Když to if nebudete používat, bude i jednička...
for (i=0; i<14; i++) //vypisou se cerne suda a cervene licha cisla od 0 krome 1...proc?
{
document.write([i++]+" <b style='color: red;'>"+ [i]+ " </b>");
} |
||
| tiso Profil |
#5 · Zasláno: 3. 8. 2010, 13:36:41
Joan: nepoužívaj konštrukcie typu:
for (i=0; i<14; i++){
…
if(i++){
…
}
} |
||
|
Časová prodleva: 3 dny
|
|||
| Joan Profil |
#6 · Zasláno: 6. 8. 2010, 11:08:02
Kajman:
1) Díky moc! Ale pořád přemýšlím nad tím, jak je možné, že výpis skutečně začíná nulou, když v document.write je hned na začátku zvětšení o 1 [i++] - tady bych očekávala vypis od jedničky. A v červeném zobrazení je pouze [i] bez inkrementace, takže bych čekala naopak menší číslo než černé. Prostě naopak. Když jsem ++ prohodila, tak se to samozřejmě rozsypalo. Proč vlastně není radno používat IF uvnitř cyklu? 2) Objevila jsem velice názorný článek o používání objektu this, hlavne kód úplně dole: <script language="JavaScript" type="text/javascript"><!--
function zmena(p)
{
p.style.color = "yellow";
p.style.backgroundColor = "blue";
p.style.fontWeight = "bold";
}
function zmenaZpet(p)
{
p.style.color = "black";
p.style.backgroundColor = "white";
p.style.fontWeight = "normal";
}
//-->
</script>
<p id="prvni" onclick="zmena(this);">Změny v prvním odstavci pomocí funkce</p>
<p id="druhy" onclick="zmena(this);" ondblclick="zmenaZpet(this);">Změny v druhém odstavci pomocí funkce</p>Funguje, jak chci, ale mám otázku: a) chtěla bych, aby se dalším kliknutím formátování textu vrátilo na původní vzhled. Lze za nějakých podmínek použít 2x onclick u jednoho a téhož prvku anebo není jiné řešení, než mám, tj. s ondblclick? b) musím explicitně deklarovat veškeré formátování pro výchozí vzhled (do použité události ondblclick) anebo existuje nějaká "zkratka" pro default? Děkuji a přeji příjemný, byť upršený pátek :-) |
||
| habendorf Profil |
#7 · Zasláno: 6. 8. 2010, 11:45:21
p {color:yellow;background-color:blue;font-weight:bold;}
p.zmeneny {color:black;background-color:white;font-weight:normal;}
function zmena(p)
{
p.className = (p.className == 'zmeneny') ? '' : 'zmeneny';
} |
||
| Joan Profil |
#8 · Zasláno: 6. 8. 2010, 12:08:57
habendorf:
Aha, rozumím. A kdybych takhle chtěla měnit všechny odstavce na celém webu (tj. desítky), tak musím formátovací deklaraci vepsat do každičkého odstavce, že. Proč mě toto zajímá: mnohdy by se mi u dlouhého článku hodilo označit si jeden, dva, tři odstavce, které mne více zaujmou nebo se k nim chci po dočtení celého textu vrátit - a už je potom často těžko hledám. |
||
| habendorf Profil |
#9 · Zasláno: 6. 8. 2010, 12:12:26
Nemusíš. Přes document.getElementsByTagName si vytvoříš pole všech odstavců a obsluhu události onclick jim přiřadíš hromadně.
|
||
| habendorf Profil |
#10 · Zasláno: 6. 8. 2010, 12:15:48
Teda nevím čemu říkáš formátovací deklarace. Já mluvím o volání té funkce zmena. Formátování je záležitostí CSS.
|
||
| Joan Profil |
#11 · Zasláno: 6. 8. 2010, 12:28:49 · Upravil/a: Joan
habendorf:
No jo, samozřejmě volání funkce, pravdu díš :) A toto: p {color:yellow;background-color:blue;font-weight:bold;}
p.zmeneny {color:black;background-color:white;font-weight:normal;}normálně do CSS nebo do scriptu? |
||
| habendorf Profil |
#12 · Zasláno: 6. 8. 2010, 12:50:15
Do CSS.
|
||
| Joan Profil |
#13 · Zasláno: 6. 8. 2010, 14:46:12
habendorf:
Díky, už je mi všechno jasné. A taky i to, že [i++] znamená postinkrementaci, tj. napřed se číslo vypíše a až potom zvětší o jedničku. Kéž by mi to zapalovalo rychleji ;-) |
||
| _es Profil |
#14 · Zasláno: 6. 8. 2010, 17:40:38 · Upravil/a: _es
Joan:
habendorfov kód sa dá vylepšiť: document.onclick = function(e) {
e = e || window.event;
var t = e.target || e.srcElement;
if(t.tagName === "P") t.className = (t.className === 'zmeneny') ? '' : 'zmeneny';
}; |
||
|
Časová prodleva: 16 let
|
|||
0