taka poboczna uwaga:
var xmlhttp = new XMLHttpRequest();
Jeśli już używasz jQuery, to trochę bez sensu jest używanie XMLHttpRequest
, skoro w jQuery masz już .get
, .post
czy .ajax
, które robią to samo, tylko łatwiej.
Poza tym w przeglądarkach jest natywnie coś takiego jak fetch
https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API
document.getElementById("page").innerHTML = this.responseText;
Podobnie to. To po co ci jQuery, skoro w jednym miejscu go używasz, a w drugim piszesz ręcznie to, co w jQuery miałbyś łatwiej?
Niech zgadnę - pewnie przekopiowałeś kod z kilku różnych miejsc i nic z tego co napisałeś, nie jest twoje do końca. I w jednym skrypcie, który przekopiowałeś używali XMLHttpRequest, w drugim jQuery... Bo to chyba najbardziej prawdopodobne wyjaśnienie.
Jeśli chcesz w ten sposób "get shit done", bo np. nie jesteś programistą, a masz np. blog o zbieraniu znaczków i chcesz po prostu dopisać do niego jakąś funkcję, to jeszcze ujdzie.
Ale jeśli chcesz się nauczyć programować albo ogólnie już programujesz, i chcesz zrobić coś większego, to trochę naokoło idziesz. I takie pozorne skróty kosztują cię czas (choćby fakt, że ci nie działa i musisz szukać odpowiedzi na forum). Lepiej poświęcić naukę na naukę podstaw, zamiast bawić się w zgadywankę, dlaczego coś nie działa.
Tak samo stosujesz nie wiadomo dlaczego 3 różne rodzaje podpinania eventów (za pomocą jQuery, za pomocą atrybutu onclick='login()
i np. window.onload =
, takie coś można robić jak się wie, co się robi i jak poszczególne rzeczy działają. Jeśli nie wiesz, to lepiej zostań przy element.addEventListener
(albo po prostu użyj jQuery, który pod spodem ci to sam podpina).
$('#c_right').on( "click", function() {
Ten fragment z dokumentacji:
Event handlers are bound only to the currently selected elements; they must exist at the time your code makes the call to .on(). (...). Alternatively, use delegated events to attach event handlers.
http://api.jquery.com/on/
czyli bardziej (patrząc w przykłady z dokumentacji i próbując je zastosować) np.
$("#c").on("click", "#c_right", function() {});
niż
$("#c #c_right").on("click", function() {});
które nie działa (swoją drogą dokumentacja trochę mgliście to tłumaczy i można faktycznie pomyśleć, że drugi sposób zadziała).
http://jsfiddle.net/z9bpqemo/
poza tym google: javascript event delegation, przydałoby się ogarniać, w jaki sposób w ogóle to działa pod spodem.
No i użycie id (zamiast np. klasy) też mi się wydaje słabym pomysłem, podobnie jak ciągnięcie AJAXem tego przez internet, z drugiej strony nie wiem, co jest w elemencie #c_right
, jaką to rolę ma spełniać?