Internet Explorer ignoriert Javascript onblur() und focus() Befehle

Question

Ich habe das folgende Problem. Ich habe eine Seite mit mehreren Formen darauf. Ich muss die Standard-Tabindex-Einstellungen einiger Formulare ändern. Wenn ich das tabindex-HTML-Attribut verwende, dann bricht es die "funktionierenden" Formulare ab, also verwende ich JQuery, um blur() -Ereignisse abzufangen und focus() auf die richtigen Eingabeelemente zu setzen.

Mein HTML:

<table> 
      <tr> 
       <td>Property Name: </td> 
       <td><input type="text" class="Text" id="property_name" name="property_name" /></td> 
       <td width="50">&nbsp;</td> 
       <td>Site Contact: </td> 
       <td valign="top" rowspan="3"> 
        <textarea class="Default" id="site_contact" name="site_contact"></textarea> 
       </td> 
      </tr> 
      <tr> 
       <td>Address: </td> 
       <td> 
        <input type="text" class="Text" id="property_address" name="property_address" /> 
       </td> 
      </tr> 
      <tr> 
       <td>City: </td> 
       <td> 
        <input type="text" class="ShortText" id="property_city" name="property_city" /> 
       </td> 
      </tr> 
      <tr> 
       <td>State: </td> 
       <td> 
        <input type="text" class="ShortText" id="property_state" name="property_state" /> 
       </td> 
       <td width="50">&nbsp;</td> 
       <td>Comments: </td> 
       <td valign="top" rowspan="3"> 
        <textarea class="Default" id="property_comments" name="property_comments"></textarea> 
       </td> 
      </tr> 
      <tr> 
       <td>Zip: </td> 
       <td> 
        <input type="text" class="ShortText" id="property_zip" name="property_zip" /> 
       </td> 
      </tr> 
      <tr> 
       <td>Description: </td> 
       <td><?php Utilities::showPropertyDescriptionDdl('property_description', 'property_description'); ?></td> 
      </tr> 
      <tr><td>&nbsp;</td></tr> 
      <tr> 
       <td>&nbsp;</td> 
       <td> 
        <input type="submit" class="submit" value="Save" id="SaveProperty" /> &nbsp; 
        <input type="button" class="simplemodal-close" value="Cancel" id="CancelProperty" /> 
       </td> 
      </tr> 
     </table> 

Mein JQuery:

$('#PropertyForm [name=property_name]').blur(function() { $('#PropertyForm [name=property_address]').focus(); }); 
$('#PropertyForm [name=property_address]').blur(function() { $('#PropertyForm [name=property_city]').focus(); }); 
$('#PropertyForm [name=property_city]').blur(function() { $('#PropertyForm [name=property_state]').focus(); }); 
$('#PropertyForm [name=property_state]').blur(function() { $('#PropertyForm [name=property_zip]').focus(); }); 
$('#PropertyForm [name=property_zip]').blur(function() { $('#PropertyForm [name=property_description]').focus(); }); 
$('#PropertyForm [name=property_description]').blur(function() { $('#PropertyForm [name=site_contact]').focus(); }); 
$('#PropertyForm [name=site_contact]').blur(function() { $('#PropertyForm [name=property_comments]').focus(); }); 

Was geschehen soll: Wenn das property_name Element des Fokus verliert, soll das property_address Element gewinnen.

Was passiert: Wenn das Element property_name den Fokus verliert, erhält das Element site_contact den Fokus und leitet den Fokus sofort an das Element property_comments weiter.

Dies geschieht in Internet Explorer 7 und 8. In FireFox funktioniert alles wie erwartet. Gibt es etwas über zwei Elemente in einer Zeile, die Onblur-Ereignisse zugewiesen haben, dh property_name und site_contact treten nacheinander im HTML auf.

Answer 1

Ich denke, dass Sie die Standard-JavaScript-Funktionalität deaktivieren möchten. Welches wird nach deinem Code ausgeführt werden.

versuchen Sie etwas wie das. Dies ist nur Pseudo-Code, aber ich denke, Sie müssen Javascript wissen lassen, dass es nicht seine eingebauten Standard-Event-Handler ausführen soll.

.blur(function() { //your code here; return false}); 

Answer 2

Sie sollten .focusout() und .focusin() versuchen. Der große Unterschied, wie in der API festgestellt ist, dass diese Blase, aber wenn ich mich recht erinnere, sie auch in IE6 arbeiten + jQuery API - focus Out

Answer 3

ich das KeyDown-Ereignis verwenden würde zu fangen, wenn die Tab-Taste gedrückt wird.

$('#PropertyForm [name=property_name]').keydown( 
    function(e) { 
     if (!e.shiftKey && e.keyCode == 9) { 
      $('#PropertyForm [name=property_address]').focus(); 
      e.preventDefault(); 
     } 
}); 
$('#PropertyForm [name=property_address]').keydown( 
    function(e) { 
     if (!e.shiftKey && e.keyCode == 9) { 
      $('#PropertyForm [name=property_city]').focus(); 
      e.preventDefault(); 
     } 
});