Tabindex基於輸入鍵通過獲取表單elemens不工作在jquery

我有一個表單，我能夠通過serializeArray()獲取所有表單元素。我想要focus()基於它們的tabindex值使用回車鍵的表單元素。只有在它有價值或者專注於自己的時候。Tabindex基於輸入鍵通過獲取表單elemens不工作在jquery

小新的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();

來源

2011-01-08 Ullas Prabhakar

您能否提供您正在使用的HTML？直到一些建議：移動var key ...在this.keypress函數中，使用onload/ready狀態來啓動entertab（）：$（function（）{/ * here code//}）;並且你使用的是「theform」，那不是標籤名稱，如果它是一個類名，那麼使用$（「。theform」）。entertab（）; – 2011-01-08 11:36:30

我想我明白你想要做什麼。我改寫了你的代碼，並結束了與此：

(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工作的例子。

來源

2011-01-08 12:05:30 mekwall

@ullasvk，沒問題，但這是否回答你的問題？如果是這樣，請接受這個答案。 – mekwall 2011-01-08 18:37:03

你也可以試試這個 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和其他瀏覽器中測試

來源

2013-07-31 13:04:20

Tabindex基於輸入鍵通過獲取表單elemens不工作在jquery

回答

相關問題