div - jquery text




Hören Sie sich Änderungen innerhalb eines DIV an und handeln Sie entsprechend (5)

Das change ist auf input , textarea und select .

Weitere Informationen finden Sie unter http://api.jquery.com/change/ .

Ich habe eine Funktion, die ein XML-Dokument greift und es in ein XSL-Dokument umwandelt. Das Ergebnis wird dann in ein Div mit der ID laneconfigdisplay . Was ich tun möchte, ist, getrennt von der Transformationslogik, ein jQuery-Änderungsereignis für dieses div einzurichten, damit ich feststellen kann, wann es geändert wurde, und etwas jQuery-Code ausführen.

Ich habe folgendes versucht, aber es funktioniert nicht!

$(document).ready(function()
{
    $('#laneconfigdisplay').change(function() {
        alert('woo');
    });
    //Do XML / XSL transformation here
});

<!-- HTML code here -->
<div id="laneconfigdisplay"></div>

Was mache ich falsch?


Es gibt ein hervorragendes Jquery-Plugin, LiveQuery , das genau dies tut .

Live Query nutzt die Möglichkeiten von jQuery-Selektoren, indem Ereignisse automatisch gebunden oder Rückrufe für übereinstimmende Elemente ausgelöst werden, selbst nachdem die Seite geladen und das DOM aktualisiert wurde.

Sie können beispielsweise den folgenden Code verwenden, um ein Klickereignis an alle A-Tags zu binden, sogar an alle A-Tags, die Sie über AJAX hinzufügen können.

$('a').livequery('click', function(event) { 
    alert('clicked'); 
    return false; 
}); 

Nachdem Sie Ihrem Dokument neue A-Tags hinzugefügt haben, bindet Live Query das Klickereignis, und es gibt nichts weiter, was aufgerufen oder ausgeführt werden muss.

Hier ist ein Arbeitsbeispiel seiner Magie ...


Sie können Ihre eigenen benutzerdefinierten Ereignisse erstellen, sodass Sie immer eine klare Trennung der Logik haben.

An ein benutzerdefiniertes Ereignis binden:

$('#laneconfigdisplay').bind('contentchanged', function() {
  // do something after the div content has changed
  alert('woo');
});

In Ihrer Funktion, die das div aktualisiert:

// all logic for grabbing xml and updating the div here ..
// and then send a message/event that we have updated the div
$('#laneconfigdisplay').trigger('contentchanged'); // this will call the function above

Versuche dies

$('#D25,#E37,#E31,#F37,#E16,#E40,#F16,#F40,#E41,#F41').bind('DOMNodeInserted DOMNodeRemoved',function(){
          // your code;
       });

Verwenden Sie dies nicht. Dies kann die Seite zum Absturz bringen.

$('mydiv').bind("DOMSubtreeModified",function(){
  alert('changed');
});

http://api.jquery.com/change/

Die Änderung funktioniert nur für Eingabeformularelemente.

Sie können nach Ihrer XML / XSL-Umwandlung einfach eine Funktion auslösen oder einen Listener erstellen:

var html = $('#laneconfigdisplay').html()
setInterval(function(){ if($('#laneconfigdisplay').html() != html){ alert('woo'); html = $('#laneconfigdisplay').html() } }, 10000) //checks your content box all 10 seconds and triggers alert when content has changed...




jquery