TabindexはフォームエレメンツをJqueryで使用できないようにすることによって入力キーに基づいています

Question

私はフォームを持っており、すべてのフォーム要素をserializeArray()で取得できます。 Enterキーを使用して、tabindex値に基づいてフォーム要素上のfocus()にします。それに価値がある場合、あるいはそれ自体に焦点を当てている場合のみ。 jQueryのへ

リトル新​​しい

は

$.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(); 

Answer 1

...間違いので、もし私が、私はあなたが何をしたいのかを理解すると思います。私はあなたのコードを書き直しましたし、これで終わった：

(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); 

jsFiddleの実施例があります。

Answer 2

また、この HTML

<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(); }) 

を試すことができます//////////// // EI、Chrome、Mozillaで正常に動作しました。 Safariや他のブラウザではテストされていません