2014-10-20 142 views
1

請考慮下面的代碼:keydown事件不正確觸發使用jQuery觸發

<input name="TextBox1" type="text" value="1111111111" id="TextBox1" /> 
<br /> 
<input name="TextBox2" type="text" value="222222222" id="TextBox2" /> 
<br /> 
<input name="TextBox3" type="text" value="3333333333" id="TextBox3" /> 
<br /> 
<input name="TextBox4" type="text" value="4444444444" id="TextBox4" /> 
<br /> 
<select name="DropDownList1" id="DropDownList1"> 
    <option value="1">1</option> 
    <option value="2">2</option> 
    <option value="3">3</option> 
</select> 
<br /> 
<input id="CheckBox1" type="checkbox" name="CheckBox1" /> 
<label for="CheckBox1">nima</label> 
<br /> 
<input id="Button1" type="button" value="button" /> 

和javascript:

$(document).ready(function() { 
     $("#Button1").click(function() { 
      var e = jQuery.Event("keydown"); 
      e.which = 9; // # Some key code value 
      e.keyCode = 9; 
      $("#TextBox1").trigger(e); 
     }); 

     $("#TextBox1").on("keydown", function (e) { 
      alert(e.keyCode); 
     }); 
    }); 

當我按下TABTextBox1問題是我得到的消息「9 「爲keyCodeTextbox2得到重點。但是當我按Button1時,我得到訊息「9」爲keyCode,但Textbox2未獲得重點。我的錯誤在哪裏? 感謝

Live Demo

回答

2

的錯誤是,你沒有實際處理TAB按自己的瀏覽器。按TAB,同時一個互動元素具有焦點會通知瀏覽器您希望將焦點移到行中的下一個元素(基於tabIndex)。

此處的按鈕實際上不是按下TAB鍵,而是將選項卡事件傳遞給input元素。

如果你想有這樣的動作模糊#TextBox1元素和重點#TextBox2元素,你可以使用jQuery的blur()focus()功能:

$("#TextBox1").on("keydown", function (e) { 
    if (e.which === 9) { 
     $(this).blur(); 
     $('#TextBox2').focus(); 
    } 
}); 

JSFiddle demo

+0

謝謝@詹姆斯。問題是我想使用Enter鍵在我的控件之間導航。我爲此使用了一個代碼,但該代碼不再適用於IE 11。請參閱此主題:http://stackoverflow.com/questions/26438274/replace-keycode-in-ie-11 – Arian 2014-10-20 09:47:38

+0

@Kerezo這是一個不同的問題。如果您覺得我的帖子在這裏回答了您在此提出的問題,請您接受它,以便它可以關閉?謝謝! – 2014-10-20 09:54:57