| Autor | Zpráva | ||
|---|---|---|---|
| Gavier Profil |
#1 · Zasláno: 3. 7. 2012, 09:10:52
Dobrý den mám problém, vložil jsem na stránku div pomocí innerHTML. Vše proběhlo ok, ale nefungují mi u něj žádné JS události. Chtěl bych ho po kliknutí z html odstranit. Četl jsem si časté potíže a pochopil jsem že innerHTML vytvoří prakticky nový dokument. Předpokládám že je problém v tom, ale nevím jak to řešit.
$(".more").click(function(){
var edata= document.getElementById("content").innerHTML;
document.getElementById("content").innerHTML=(edata + '<div id="overlay"><a onclick="alert("ASDFDS");">odkaz</a></div>');
});
$("#overlay").click(function(){
alert("ASDFDS");
});Po kliknutí na "overlay" ani "odkaz" se nic neděje. (alerty tam mám jen pro otestování) Jde mi o tom zobrazit další okno(div), kde jeho okolí bude "overlay" a po kliknutí na něj odstaním "overlay" a veškerý kod v něm vnořený. Pokud to lze řešit jednodušeji např pomocí jQuery , tak uvítám radu. Děkuji. #overlay {
background: none repeat scroll 0% 0% black;
left: 0px;
position: absolute;
top: 0px;
z-index: 9500;
opacity: 0.8;
height:100%;
width:100%;
color:red;
display: block;
}Stránka kde to aplikuji (po kliknutí na "+ VÍCE INFORMACÍ") |
||
| pcmanik Profil |
#2 · Zasláno: 3. 7. 2012, 10:01:34
Gavier:
Pouzi metodu html, alebo append ktore ma jQuery. A nezabudaj ze elementy ktore este na stranke niesu nemozu mat udalosti. Tie im pridas az po ich zacleneni do stranky. |
||
| Gavier Profil |
#3 · Zasláno: 3. 7. 2012, 12:40:21
pcmanik:
Použil jsem append, děkuji za radu. Pokud to dobře chápu, tak tedy události pro ty vkládané elementy musím vložit také v appendu? Zkusil jsem to, ale stále mi to nejde. Kod ted vypadá takhle: $(".more").click(function(){
$("#content").append("<div id\=\"overlay\"><a onclick\=\"alert(\"ASDFDS\");\">odkaz<\/a><\/div><script type\=\"text/javascript\">$(\"#overlay\")\.click(alert(\"ASDFDS\");<\/script>");
});Když dám zobrazit zdrojový kod výběru tak mi to ve firefoxu zobrazí: <a onclick="alert(" asdfds");"="">odkaz</a>Pokud dám prozkoumat prvek tak mi to zobrazuje (také ve firefoxu): <a asdfds");(=(( onclick"alert(">odkaz</a>Myslel jsem, že je to špatnou syntaxí kokrétně escape sekvencí. Proto jsem přidal do kodu ty backslashe, ale nijak se to neprojevilo. |
||
| pcmanik Profil |
#4 · Zasláno: 3. 7. 2012, 13:31:57
Gavier:
Az za appendom staci zavolat tu obsluhu udalosti - teda priradenie udalosti click na id overlay. |
||
| Gavier Profil |
#5 · Zasláno: 3. 7. 2012, 16:26:03
pcmanik:
Děkuji už to funguje, výsledný kód: $(".more").click(function(){
$("#content").append('<div id="overlay"><div id="more"></div></div>');
$("#overlay").click(function(){
$("#overlay").remove();
});
}); |
||
| pcmanik Profil |
Gavier:
Este v tej udalosti click pouzi namiesto $("overlay").remove() $(this).remove(). Jquery potom nemusi znovu hladat element na stranke ale pouzije jeho referenciu ktora je ulozena prave v objekte this, usetris tym trosku vykonu a zrychlis aplikaciu ;) |
||
| _es Profil |
#7 · Zasláno: 4. 7. 2012, 07:35:24
pcmanik:
„pouzi namiesto $("overlay").remove() $("this").remove().“ Snáď asi $(this).remove().
|
||
| pcmanik Profil |
#8 · Zasláno: 4. 7. 2012, 10:25:19
_es:
Ano moja chyba, dakujem za opravu :) |
||
| 1Pupik1989 Profil |
Nebo:
$(".more").click(function(){
var more = $("<div/>",{id:"more"}).text("Nějaký text");
$("<div/>",{id:"overlay"}).append(more).click(function(){
$(this).remove();
}).appendTo("#content");
}); |
||
| pcmanik Profil |
#10 · Zasláno: 4. 7. 2012, 13:45:42
1Pupik1989:
V com je tvoj kod lepsi? Je menej prehladny a spotrebuje viac casu na vykonanie. |
||
| 1Pupik1989 Profil |
pcmanik:
Nevím, prostě když používám JQuery, tak přes JQuery vytvářím i Elementy. Kdybych je nechtěl vytvářet přes JQuery, tak bych JQuery v tomto případě vůbec nepoužil. Navíc znatelné spotřebování času na vykonání jsem nezaznamenal. 0 - 1ms stejně jako kód výš. |
||
| Chamurappi Profil |
#12 · Zasláno: 4. 7. 2012, 16:51:00
Reaguji na 1Pupika1989:
„Navíc znatelné spotřebování času na vykonání jsem nezaznamenal.“ Obhajovat cokoliv neefektivního či vyloženě blbého tím, že jsou počítače a prohlížeče rychlé, je trestuhodně hloupé. Tvůj kód je navíc hůř čitelný a odfláknutý, takže neefektivita nemá žádné polehčující okolnosti. |
||
| 1Pupik1989 Profil |
Dobrá, sice nechápu co je na tom tak strašně "špatného", takže to vzdávám. Pod slovem "odfláknutý" si dokážu představit leccos.
O počítačích a prohlížečích jsem se vůbec nezmiňoval, pouze že jsem nic nezaznamenal. Jinak kód jsem poupravil. Není to náhodou to samé jako viz. níže? .html('<div id="overlay"><div id="more"></div></div>').innerHTML = '<div id="overlay"><div id="more"></div></div>') Neberte to ve zlém, ale teď vás nějak nepobírám. Asi bych se měl vrátit k základům Javascriptu. |
||
| pcmanik Profil |
1Pupik1989:
Nedeklaroval si premenne predtym, naviac zbytocne volas niektore jQuery metody, naco volat priradenie atributu id do elementu, ked mozes rovno vytvorit element, ktory ten atribut uz v sebe ma? Upravujes domovu strukturu o 2 krat viac ako Gavier a nema to ziadne opodstatnenie. Ak stale neveris, ze tvoje riesenie mrha vykonom pozri sa na test. // Edit1: Ako prave pozeram tvoje riesenie je s vykonom v IE 9 doslova zalostne. // Edit2: Pridal som aj cisty Javascript |
||
| 1Pupik1989 Profil |
Ja marne počítal s tìm, že se někde s těmi elementy bude dál pracovat, v tomto případě ne.
Co jsem četl v testech, tak jquery je brzda. Doufám, že mi začátečnické chyby odpustíte. Navíc jquery je moje letmá smrt. v ie9 0.9ms, takže to nepoznám a žádný performance tester neznám. |
||
| pcmanik Profil |
#16 · Zasláno: 4. 7. 2012, 23:56:11
1Pupik1989:
Od toho je diskusia, aby sa tu kazdy naucil nieco nove :) |
||
| 1Pupik1989 Profil |
#17 · Zasláno: 5. 7. 2012, 00:29:54
Ano, toť pravda. Mě hlavně nedošlo, že to more se dál používat nebude. Já čekal k tomu i navigaci.
Člověk se stále učí. Nejhorší je, že složité věci vyřeším, ale ty jednoduché mi vrtají hlavou. |
||
| Gavier Profil |
#18 · Zasláno: 5. 7. 2012, 14:06:12
Díky za rady,
ještě mám jeden dotaz. Do "#more" vkládám další obsah stránky, pokud ho vkládám pomocí JS tak vše funguje jak má. Příjde mi to ale trochu nepřehledné a hůř upravitelné (myslím ten kokrétní vkládaný html kod) chtěl jsem pomocí appendu nebo innerHTML vložit PHP include, ale nefunguje mi to. Pomocí JS mohu vložit jen HTML kod? $("#more").append('<? include("./osvezovna.php") ?>'); |
||
| jenikkozak Profil |
Gavier:
PHP příkazy se zpracovávají na serveru, JS se provádí až s výsledkem, který server pošle prohlížeči. Takto, jak uvádíš, se obě technologie spojit dají, ale možná to udělá něco jiného, než máš v plánu. Záleží na tom, co je obsahem souboru vloženého pomocí include a čeho vlastně chceš dosáhnout. |
||
| Aldred Profil |
#20 · Zasláno: 5. 7. 2012, 14:19:08
javascript se provadi az na strane uzivatele (vicemene to provadi prohlizec), pricemz PHP se zpracovava na strane serveru. Pokud chces nacitat nejakym zpusobem data ze serveru pomoci javascriptu, musis pouzit AJAX
|
||
| Gavier Profil |
#21 · Zasláno: 6. 7. 2012, 15:46:31
jenikkozak, Aldred:
Potřeboval bych do toho obsahu vkládaného pomocí JS vložit php galerii, kterou mám už hotovou bokem. Zkusím nastudovat AJAX, díky. |
||
|
Časová prodleva: 12 let
|
|||
0