2011-08-03 3 views
0

このJavaScriptは非常に便利ですが、それに対するフィードバックを得ることは、私はあなたたちは私を克服するのを助けることができ期待していたいくつかの制限があります。このJavascriptコードの制限を改善するのに役立ちますか? jQueryのからの機能を使用しています

この関数は、基本的に、時間のかかる入力(HH:MM:SS)のテキストボックスを作成するので、多くのクリックを伴う日付時間ピッカーを使用する必要はありません。

Code: 

//global variable for keeping count on how many times the function is called 
var i = 0; 

//for adding formatted time fields 
function timemaker() 
{ 

//creates an input field of text type formatted with a value of "00:00:00" 
var input = $("<input>", 
    { 
     name: 'time'+i, // e.g. time0, time1, time2, time3 
     value: '00:00:00', 
     maxlength: '8', 
     size: '6' 
    }); 

    //this function which uses jquery plugin causes the cursor in the field to goto position zero 
    //when selected making it easier for the user to enter times and not need to select the correct position 
    input.click(function() 
    { 

     $(this).prop({ 
      selectionStart: 0, 
      selectionEnd: 0 
     }); 

     //this child function moves the cursor along the text field 
     //when it reaches the first ":" it jumps to the next "00" 
     }).keydown(function() { 

    if (event.keyCode == 9) 
    { 
     return; 
    } 

    else 
    { 
       var sel = $(this).prop('selectionStart'), 
       val = $(this).val(), 
       newsel = sel === 2 ? 3: sel; 
       newsel = sel === 5 ? 6: newsel; 

      $(this).val(val.substring(0, newsel) + val.substring(newsel + 1)) 

      .prop({ 
       selectionStart: newsel, 
       selectionEnd: newsel 
      }); 
    } 
}); 

//this appends the text field to a divved area of the page 

input.appendTo( "#events"); i ++; リターン; }

午前0時00分00秒

私はあなたが明らかにしません 、12時45分00秒の時間を入力したい例えば

  • 言って助けを必要と制限事項 が既に存在するので、秒の部分(最後の "00")を入力する必要があります。だから、そのテキストフィールド 外のタブに決めるが、Javascriptをエントリとしてあなたの「タブ」キー入力を解釈し、 値が12のようになり原因フィールドからのゼロを削除します:45:0
  • ていませんあなたは、それを行うには 可能になると思いますformat- 24時間の入力を検証しますか?例えば最初に入力する数字は「2」ですので、 のオプションは「0,1,2,3」です
  • 4桁目に間違いがあり、テキストフィールド を間違えた場合は、もう一度すべてを入力する必要があります。

答えて

0

あなたが欠けている主なことは、これらすべての要件を実装できることは、jQueryがkeydownイベントハンドラであなたに渡す引数だと思います。だから、これにその行を変更:

.keydown(function(event){ 
    if (event.keyCode == 9) { return; } 

    ... the rest of your code ... 

とあなたが押されたものを特定し、それに応じて行動を取るようにevent.keyCodeを使用することができます。したがって、たとえば、event.keyCode == 9の場合、ユーザーはTabキーを押しました。

+0

だから私は(機能を.keydownているだろう(event.keyCodeは== 9){//何もしない} ?? – sqlmole

+0

あなたは一種の正しい考えを持って、私はより明確に何を意味するのかをお見せするために私の答えを編集した – Milimetric

+0

私はそれが私の変更されたコードを見てみましたOK:あなたはそれが動作するタブ! – sqlmole

0

これは少しアウトオブボックスソリューションですが、物事はあなたのフィルターテキストボックスと一緒に動作しない場合は、それを検討するかもしれない:

http://jsfiddle.net/YLcYS/4/

関連する問題