Forum PHP.pl > [jQuery] .append() a przeglądarka Internet Explorer

Pomoc - Szukaj - Użytkownicy - Kalendarz

Pełna wersja: [jQuery] .append() a przeglądarka Internet Explorer

Forum PHP.pl > Forum > Po stronie przeglądarki > JavaScript

patrix007

15.09.2010, 19:45:49

Witam,

Mam problem z działaniem .append() / .prepend() w przeglądarce IE - nic się nie dopisuje...
wszystko inne na czym testowałem (Opera/Chrome/Safari) bez problemu łapie to.

Przedstawiam przykład:

[HTML] pobierz, plaintext 
<html>
<head>
	<title>I have a problem...</title>
	<script language="javascript" type="text/javascript" src="http://code.jquery.com/jquery-1.4.2.min.js"></script>
	<style type="text/css">
		.tab { border: 1px solid black; }
	</style>
</head>
<body>
	<p>This works in Opera, Firefox, Safari, Chrome... in Internet Explorer doesn't work !! :-/ <strong>Why ?!</strong></p>
	<input type="button" id="button" name="button" value="click me!">
 
	<table><div id="container"></div></table>
 
	<script type="text/javascript">
		var i = 1;
		$('#button').click(function() {
			$("#container").append("<tr><td class=\"tab\">"+i+"</td><td class=\"tab\">"+i+"</td></tr>");
			i++;
		});	
	</script>
</body>
</html>
[HTML] pobierz, plaintext

Jak to zmusić do działania ?
Dzięki za pomoc.

erix

15.09.2010, 20:14:37

Bo do IE musisz dopisywać do

Kod

$('#container tbody')

z tego, co widze we mgle swoich szarych komórek.

zegarek84

15.09.2010, 20:50:46

nie chodzi o adres tylko o odwieczny problem innerHTML w IE z formularzami i tabelkami...

tutaj jest rozwiązanie na formularz [może i z tabelkami zadziała...]:
http://domscripting.com/blog/display/99

tutaj gościu pisze o zastąpieniu całej tabelki:
an idea to fix innerHTML to table in IE (firefox)

swoją drogą bardzo wygodny jest format JSON - i wystarczy zrobić jedną małą klasę by wszystko dodawało przez DOM - wtedy nie ma najmniejszych problemów ;]

patrix007

15.09.2010, 21:58:52

Dzięki za odpowiedzi.
Na szczęście obyło się bez klas i innych rozwiązań, udało mi się rozwiązać ten problem chyba w najprostszy sposób i teraz działa wszędzie:

[HTML] pobierz, plaintext 
<html>
<head>
	<title>I have a problem...</title>
	<script language="javascript" type="text/javascript" src="http://code.jquery.com/jquery-1.4.2.min.js"></script>
	<style type="text/css">
		.tab { border: 1px solid black; }
	</style>
</head>
<body>
	<p>Now this works in Opera, Firefox, Safari, Chrome... and Internet Explorer ;-)</p>
	<input type="button" id="button" name="button" value="click me!">
 
	<div id="container">
		<table></table>
	</div>
 
	<script type="text/javascript">
		var i = 1;
		$('#button').click(function() {
			$("table").append("<tr><td class=\"tab\">"+i+"</td><td class=\"tab\">"+i+"</td></tr>");
			i++;
		});	
	</script>
</body>
</html>
[HTML] pobierz, plaintext

Niby tak samo a jednak nie, uwielbiam IE, dla niej trzeba robić specjalne wyjątki

W przypadku jeśli mamy więcej tabelek to rozróżniamy je kontenerami (zwykłe div'y):

[HTML] pobierz, plaintext 
		var i = 1;
		$('#button').click(function() {
			$("#container_a table").append("<tr><td class=\"tab\">"+i+"</td><td class=\"tab\">"+i+"</td></tr>");
			i++;
		});	
		var j = 1;
		$('#buttonn').click(function() {
			$("#container_b table").append("<tr><td class=\"tab\">a"+j+"</td><td class=\"tab\">a"+j+"</td></tr>");
			j++;
		});			
[HTML] pobierz, plaintext

everth

15.09.2010, 22:16:28

@zegarek84 a orientujesz się może czy ten problem występuje przy najnowszych jQuery (np. 1.4.2) - lub czy jest to związane w jakim trybie działa IE (quirks mode)?

zegarek84

15.09.2010, 23:43:27

nie stosuję jQuery choć jest bardzo intuicyjne - tym bardziej nie przeprowadzałem testów... gdy potrzebuje to piszę w czystym JS ale to też tylko dla siebie - nie jestem programistą - na forum jestem bardziej hobbystycznie

z tego co pamiętam, to choć innerHTML powstało z inicjatywy Microsoftu to właśnie na IE robił często największe problemy - jQuery daaawno temu przeglądałem i nie mogę powiedzieć na 100% ale append tekstu/html'a jest w nim oparty o innerHTML...

Crozin

15.09.2010, 23:53:27

Cytat

Niby tak samo a jednak nie, uwielbiam IE, dla niej trzeba robić specjalne wyjątki

IE zachowało się w sumie najbardziej poprawnie. Napisałeś błędny kod, to co się dziwisz, że źle działa? Niestety idiotoodporność "porządnych przeglądarek" stoi na lepszym poziomie niż u IE.

Do elementu TABLE nie możesz bezpośrednio wpisać elementu DIV.

To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.