Tabindex basierend auf Enter-Taste durch Erlangen Formular-Element funktioniert nicht in Jquery

Ich habe ein Formular, und ich bin in der Lage, alle Formularelemente durch serializeArray() zu bekommen. Ich möchte focus() auf Formularelemente basierend auf ihrem Tabindex-Wert mithilfe der Eingabetaste. Nur wenn es Wert darin hat oder sich auf sich selbst konzentriert.Tabindex basierend auf Enter-Taste durch Erlangen Formular-Element funktioniert nicht in Jquery

wenig Neues zu jQuery so, wenn irgendwelche Fehler ...

$.fn.entertab = function() 
    { 

var key = e.charCode ? e.charCode : e.keyCode ? e.keyCode : 0; 
    var maxTabIndex = 20; 
     var elements = this.serializeArray(); 
    $.each(elements, function(i, element) 
     { 

this.keypress(function(e){ 
    var nTabIndex=this.tabIndex; 
     var myNode=this.nodeName.toLowerCase(); 
      if(nTabIndex > 0 && key == 13 && nTabIndex <= maxTabIndex && ((!myNode.attr("disabled")) || (myNode.val == ""))) 
     { 
    myNode.focus(); 
    } 
    else 
    { 
    nTabIndex=this.tabIndex+1; 
     myNode.focus(); 
    } 
    }); 

    }); 
     } 
    $("theform").entertab();

Quelle

2011-01-08 Ullas Prabhakar

könnten Sie den von Ihnen verwendeten HTML-Code angeben? Bis auf ein paar Vorschläge: move var key ... in der Funktion this.keypress, benutze den Status onload/ready, um das entertab() zu starten: $ (function() {/ * hier der Code * /}); und Sie verwenden "theform", das ist kein Tag-Name, wenn es ein Klassenname ist, dann verwenden Sie $ (". theform"). entertab(); –

Ich glaube, ich verstehe, was Sie tun wollen. Ich schrieb den Code und damit endete:

(function($){ 

    $.fn.entertab = function(options) { 

     var defaults = { 
      maxTabIndex: 20 
     }; 

     options = $.extend({}, defaults, options); 

     return this.filter('form').each(function(){ 

      var $this = $(this), 
       $elms = $this.find("[tabindex]"); 

      $elms.each(function(){ 
       var $elm = $(this), 
        idx = parseInt($elm.attr("tabindex")); 
       if (idx > options.maxTabIndex) { 
        return; 
       } 
       $elm.keydown(function(e){ 
        if (e.which == 13 && ($elm.val() != '')) { 
         $elms.filter("[tabindex="+(idx+1)+"]").focus(); 
         e.preventDefault(); 
        } 
       }); 
      }); 
     }); 
    }; 

})(jQuery);

Es ist ein funktionierendes Beispiel auf jsFiddle.

Quelle

2011-01-08 12:05:30 mekwall

@ullasvk, kein Problem, aber hat dies Ihre Frage beantwortet? Wenn ja, bitte akzeptiere diese Antwort. – mekwall

@MarcusEkwall Es funktioniert, plus eins für das, Der Fragesteller muss dies als Antwort markiert haben:/ –

Ihr jsfiddle funktioniert nur durch Drücken der "Tab-Taste" nicht "Enter-Taste" !! –

können Sie auch dieses HTML versuchen

<input id="122" class='TabOnEnter' tabindex="1" /><br> 
<input id="123" class='TabOnEnter' tabindex="2" /><br> 
<input id="124" class='TabOnEnter' tabindex="4" />This input is hidden<br> 
<input id="124" class='TabOnEnter' tabindex="5" /><br> 
<input id="125" class='TabOnEnter' tabindex="3" /><br> 
<textarea class='TabOnEnter' tabindex="6">Hi, I am a test area</textarea>

SCRIPT ///////////

$(document).on("keypress", ".TabOnEnter" , function(e) 
    { 
    //Only do something when the user presses enter 
    if(e.keyCode == 13) 
    { 
     var nextElement = $('[tabindex="' + (this.tabIndex+1) + '"]'); 
     console.log(this , nextElement); 
     if(nextElement.length) 
     nextElement.focus() 
     else 
     $('[tabindex="1"]').focus(); 
    } 
    }); 

//Hidden inputs should get their tabindex fixed, not in scope ;) 
//$(function(){ $('input[tabindex="4"]').fadeOut(); })

//////////// // Arbeitete gut in EI, Chrome, Mozilla. Nicht in Safari und anderen Browsern getestet

Quelle

2013-07-31 13:04:20

Tabindex basierend auf Enter-Taste durch Erlangen Formular-Element funktioniert nicht in Jquery

Antwort

Verwandte Themen