IE7-Probleme mit meinem jQuery [Klick- und Änderungsfunktionen]

Question

Ich habe die folgenden Codeschnipsel. Grundsätzlich, was ich versuche zu tun, ist in der 1. Klicken Sie auf Funktion, die ich Schleife durch meine zwischengespeicherten JSON-Daten und zeigen alle Werte, die für diese ID vorhanden sind. In der 2. ändern Funktion ich erfassen, wenn eines der Elemente Werte ändert (d.h. ja zu nein und umgekehrt).

Diese Elemente werden alle dynamisch durch die JSON-Daten generiert, die ich von einem Webservice empfange. Nach meinem Verständnis ist das der Grund, warum ich die .live-Funktionalität verwenden muss.

In Firefox funktioniert alles wie erwartet (natürlich). Im IE7 funktioniert es jedoch nicht. Wenn ich im IE7 eine Optionsschaltfläche auswähle, die eine Meldung der Klickfunktion anzeigt, wird sie auch dem Array für die geänderte Funktion hinzugefügt. Wenn das Optionsfeld jedoch nichts von der Klickfunktion tut, dann wird das Array nicht für die Änderung hinzugefügt.

Wenn ich mir diesen Code ansehe, denke ich, dass ich in der Lage sein könnte, diese 2 Funktionen miteinander zu kombinieren, aber im Moment möchte ich nur, dass es im IE7 funktioniert.

$(document).ready(function () {
    //This function is run whenever a 'radio button' is selected.
    //It then goes into the CPItemMetaInfoList in the cached JSON data
    //($.myglobals) and checks to see if there are currently any 
    //scripts to display.

$("input:radio").live("click", function () {
    var index = parseInt(this.name.split(':')[0]);
    for (i = 0; i <= $.myglobals.result.length - 1; i++) {
        if ($.myglobals.result[i].CPItemMetaInfoList.length > 0) {
           for (j = 0; j <= $.myglobals.result[i].CPItemMetaInfoList.length - 1; j++) {
                if (index == $.myglobals.result[i].QuestionId) {
                    alert($.myglobals.result[i].CPItemMetaInfoList[j].KeyStringValue);
                    return;
                }
            }
        }
    }
});
});

$(document).ready(function () {
    var blnCheck = false;
    //Checks to see if values have changed.
    //If a value has been changed then the isDirty array gets populated.
    //This array is used when the questionSubmit button is clickeds
    $('input').live('change', function () {
        blnCheck = false;

        for (i = 0; i <= isDirty.length - 1; i++) {
            if (isDirty[i] == $(this).attr("name")) {
                blnCheck = true;
                break
            }
        }

    if (blnCheck == false) {
        isDirty[arrayCount] = $(this).attr("name");
        arrayCount += 1;
        alert($(this).attr("name"));
    }
});

$('textarea').live('change', function () {
    blnCheck = false;
    for (i = 0; i <= isDirty.length - 1; i++) {
        if (isDirty[i] == $(this).attr("id")) {
            blnCheck = true;
            break
        }
    }

    if (blnCheck == false) {
        isDirty[arrayCount] = $(this).attr("id");
        arrayCount += 1;
        //alert($(this).attr("name"));
    }
});
});

UPDATE:

Ich musste diesen Teil des Codes in die Klickfunktion verschieben:

   blnCheck = false;
   for (i = 0; i <= isDirty.length - 1; i++) {
        if (isDirty[i] == $(this).attr("name")) {
            blnCheck = true;
            break
        }
    }

    if (blnCheck == false) {
        isDirty[arrayCount] = $(this).attr("name");
        arrayCount += 1;
        alert($(this).attr("name"));
    }

Zum Beispiel so:

     $(document).ready(function () {
     //This function is run whenever a 'radio button' is selected.
     //It then goes into the CPItemMetaInfoList in the cached JSON data
     //($.myglobals) and checks to see if there are currently any 
     //scripts to display.

     $("input:radio").live("click", function () {
         var index = parseInt(this.name.split(':')[0]);
         for (i = 0; i <= $.myglobals.result.length - 1; i++) {
             if ($.myglobals.result[i].CPItemMetaInfoList.length > 0) {
                for (j = 0; j <= $.myglobals.result[i].CPItemMetaInfoList.length - 1; j++) {
                     if (index == $.myglobals.result[i].QuestionId) {
                         alert($.myglobals.result[i].CPItemMetaInfoList[j].KeyStringValue);
                         return;
                     }
                 }
             }
         }
         blnCheck = false;

         for (i = 0; i <= isDirty.length - 1; i++) {
             if (isDirty[i] == $(this).attr("name")) {
                 blnCheck = true;
                 break
             }
         }

      if (blnCheck == false) {
          isDirty[arrayCount] = $(this).attr("name");
          arrayCount += 1;
      }

     });
});

Aber...

Ich musste die Änderungsfunktion beibehalten. Bei meinen Tests stellte ich fest, dass die .click-Funktion im IE7 für die Radiobuttons und Checkbox-Elemente funktionierte, aber die .change-Funktionalität funktionierte für die Textboxen und Textareas im IE7 und FF sowie für die ursprüngliche Funktionalität der Radiobuttons und Checkbox-Elemente.

Diesmal wurde es richtig schmutzig. Danke an @Patricia, dass sie sich das angeschaut hat. Ihre Vorschläge haben mich zu dieser Lösung geführt. Ich werde die Frage unbeantwortet lassen, da ich mich frage, ob es nicht eine sauberere Lösung dafür gibt.

Answer 1

Tatsache: change Ereignis für Optionsfelder und Kontrollkästchen wird nur ausgelöst, wenn die focus verloren geht (d. h. wenn die blur Ereignis steht unmittelbar bevor). Um das "erwartete" Verhalten zu erreichen, müssen Sie sich an die click Ereignis statt.

Sie möchten im Wesentlichen Folgendes ändern

$('input').live('change', function() {
    // Code.
});

zu

$('input:radio').live('click', functionName);
$('input:not(:radio)').live('change', functionName);

function functionName() {
    // Code.
}

(Ich würde allerdings auch Kontrollkästchen berücksichtigen, indem ich :checkbox Selektor für den Fall, dass Sie in Ihrem Formular welche haben, die Sie wie Radiobuttons behandeln möchten)

Answer 2

Ich denke, dies ist, weil IE die Änderung auslöst, wenn der Fokus auf Prüfungen und Radios verloren geht. so, wenn die Warnung auftaucht, wird der Fokus verloren und daher wird das Änderungsereignis ausgelöst.

EDIT:

Versuchen Sie, die $('input') Selektor auf $('input:not(:radio)')

So wird der Klick für Ihre Radios ausgelöst und die Änderung für alle anderen.

Bearbeiten #2:

Wie bout setzen die Sachen, die auf Änderung in eine separate Funktion geschieht. mit dem Index als Parameter. dann können Sie diese Funktion aus der Änderung() und die Click() aufrufen. setzen Sie den Aufruf zu dieser Funktion nach Ihrem getan mit dem Klick Zeug.

Answer 3

Sie erklären, dass Ihr blnCheck Variable innerhalb einer Ihrer document.ready() Funktionen. Sie brauchen auch nicht zwei davon, es könnte alles in einem sein.

Das bedeutet, dass die Variable, die Sie dort deklarieren, nicht diejenige ist, die verwendet wird, wenn Ihre Änderungsfunktion tatsächlich aufgerufen wird, sondern eine Art implizite globale Variable. Ich weiß nicht, ob das dazugehört, aber es könnte einen Blick wert sein. Sie sollten dies am Anfang Ihrer JS-Datei stattdessen deklarieren.