Pentru a inregistra cu jQuery un eveniment JavaScript la elemente HTML, se foloseste aceasta sintaxa:
$('element').nume_eveniment(function() {
  // cod ce va fi executat cand "nume_eveniment" e declansat
})

De exemplu, urmatorul cod afiseaza o fereastra alert cand se apasa clic pe un link cu class="cls".
<script type="text/javascript"><!--
$(document).ready(function() {
  // la clic pe link cu class="cls", afiseaza alert cu textul link-ului
  $('a.cls').click(function() {
    alert($(this).text())
  });
});
--></script>
<a href="https://marplo.net" title="Cursuri Gratuite" class="cls">marplo.net</a>

Dar daca link-ul e intr-un cod inclus mai tarziu in pagina prin ajax, scriptul de mai sus nu va functiona si pentru acel link deoarece cand codul jQuery este executat (cand pagina e incarcata), acel link nu se afla in pagina.
Dar solutia e simpla, astfel, pentru a inregistra evenimente (click, mouseover, submit, ...) la elemente HTML adaugate cu ajax, codul ce inregistreaza acel eveniment trebuie executat si dupa ce raspunsul ajax e primit. Pt. a face acest lucru, doar scrieti acel cod jQuery intr-o functie, apoi apelati acea functie in jQuery.ready(), si in functia ajax, dupa ce raspunsul de la server e primit si adaugat in pagina.
- Exemplu (vedeti comentariile din cod):
<script type="text/javascript"><!--
// seteaza o functie ca sa inregistreze evenimentul click la "a.cls"
function clickAcls() {
  // la clic pe un link cu class="cls" afiseaza alert cu textul link-ului
  $('a.cls').click(function() {
    alert($(this).text())
  });
}

$(document).ready(function() {
  clickAcls();       // acceseaza functia ca sa inregistreze eveniment click pt "a.cls"

  // cand datele din formularul "#frm" sunt transmise
  $('#frm').submit(function() {
    // aici se pot pelua datele din formular, si se definesc datele_de_trimis

    // seteaza metoda ajax() si include raspunsul in tag-ul HTML cu id="resp"
    $.ajax({
      type: 'post',
      data: 'datele_de_trimis',
      url: 'script.php',
      error: function(xhr, status, error) { alert('Eroare: '+ xhr.status+ ' - '+ error); },
      success: function(response) {
        $('#resp').html(response);

        // acceseaza functia ca sa inregistreze eveniment click pt "a.cls" adaugat in raspuns
        clickAcls();
      }
    });

    return false;      // ca sa nu deschida pagina ca se trimite formularul
  });
});
--></script>

• Aceasta metoda poate fi aplicata pt. toate tipurile de evenimente.
Iata inca un exemplu. Se inregistreaza "submit" pentru toate formularele, ca sa trimita datele din formular prin ajax, apoi include raspunsul in tag-ul cu id="resp". Evenimentul "submit" va fi inregistrat inclusiv pt. formulare adaugate cu ajax.
<script type="text/javascript"><!--
// Executa cererea Ajax
function ajaxSend(file, datele_de_trimis, resp) {
  // defineste si executa jQuery Ajax
  $.ajax({
    type: 'post',
    url: file,
    data: datele_de_trimis,
    error: function(xhr, status, error) { alert('Eroare: '+ xhr.status+ ' - '+ error); },     // alert mesaj in caz de eroare
    success: function(response) {
      resp.html(response);

      // apeleaza submitForm() ca sa inregistreze submit la formulare din raspunsul ajax
      submitForm();
    }
  });
  return false;
}

// trimite formularul cu ajaxSend()
function submitForm() {
  // cand sunt transmise date dintr-un formular
  $('form').submit(function() {
    // aici se pot pelua datele din formular, si se definesc datele_de_trimis la server

    ajaxSend('script.php', 'datele_de_trimis', $('#resp'));        // acceseaza functia pt Ajax

    return false;      // ca sa nu deschida pagina ca se trimite formularul
  });
}

$(document).ready(function() {
  submitForm();       // apeleaza functia ca sa inregistreze eveniment submit
});
--></script>

Un Test simplu in fiecare zi

HTML
CSS
JavaScript
PHP-MySQL
Engleza
Spaniola
Ce element HTML adauga continut flash SWF in pagina web?
<object> <div> <script>
<object type="application/x-shockwave-flash" data="file.swf" width="500" height="250">
 <param name="src" value="file.swf" />
 Browser-ul dv. nu suporta SWF.
</object>
Care pseudo-clasa CSS adauga un stil la un camp input de formular cand e cursorul in el?
:active :focus :hover
input:focus {
  background-color: #88fe88;
}
Clic pe instructiunea care transforma un sir JSON in obiect JavaScript.
JSON.stringify(javascript_object) object.toString() JSON.parse(json_string)
var jsnstr = '{"url": "http://coursesweb.net/", "title": "Web Development Courses"}';
var obj = JSON.parse(jsnstr);
alert(obj.url);
Indicati functia PHP care poate crea sau scrie un fisier pe server.
fopen() file_put_contents() file_get_contents()
if (file_put_contents("file.txt", "content")) echo "Fisierul a fost creat";
else echo "Fisierul nu poate fi creat";
Cum se spune "al treilea" in engleza?
threeth third three
I planted the third tree.
- Am plantat al treilea pom.
Cum se spune "al treilea" in spaniola?
segundo tres tercero
Yo planté el tercero árbol.
- Am plantat al treilea pom.
Inregistrare evenimente la elemente incluse cu jQuery ajax

Last accessed pages

  1. Curs PHP MySQL, Tutoriale si Scripturi PHP (46359)
  2. Substantive - Exercitii si teste engleza incepatori (17941)
  3. Blog si Cugetari Personale (33086)
  4. Cursuri si Tutoriale: Engleza, Spaniola, HTML, CSS, Php-Mysql, JavaScript, Ajax (118292)
  5. Prezent perfect si Prezent perfect continuu - Present perfect and Continuous (54263)

Popular pages this month

  1. Cursuri si Tutoriale: Engleza, Spaniola, HTML, CSS, Php-Mysql, JavaScript, Ajax (1341)
  2. Curs HTML gratuit Tutoriale HTML5 (933)
  3. Curs si Tutoriale JavaScript (862)
  4. Curs si Tutoriale Ajax (835)
  5. Curs CSS Online Tutoriale CSS3 (798)