選擇下一個字段按回車使用jquery

我有一個HTML表單，每當按下enter下一個字段被選中。
這裏是一個代碼。選擇下一個字段按回車使用jquery

$(document).on("keydown","input",function(event) { 
 
    \t if (event.which === 13) { 
 
    \t \t event.stopPropagation(); 
 
    \t \t event.preventDefault(); 
 
    \t \t $(this).nextAll("input").eq(0).focus(); 
 
    \t } 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<form> 
 
    \t <table> 
 
    \t \t <tr> 
 
    \t \t \t <td>Medical Record No.</td><td><input type="text" name="labNo" /></td> 
 
    \t \t </tr> 
 
    \t \t <tr> 
 
    \t \t \t <td>Age/sex </td><td><input type="text" name="age" /> 
 
    \t \t \t \t <select id="age"> 
 
    \t \t \t \t \t <option value="Year">Year</option> 
 
    \t \t \t \t \t <option value="Month">Month</option> 
 
    \t \t \t \t </select> 
 
    \t \t \t \t <select id="sex"> 
 
    \t \t \t \t \t <option value="Male">Male</option> 
 
    \t \t \t \t \t <option value="Female">Female</option> 
 
    \t \t \t \t </select> 
 
    \t \t \t </td> 
 
    \t \t </tr> 
 
    \t \t <tr> 
 
    \t \t \t <td>Phone </td> 
 
    \t \t \t <td><input type="text" name="" value="-,-" /></td> 
 
    \t \t </tr> 
 
    \t \t <tr> 
 
    \t \t \t <td colspan="2"><input type="button" id="patBtn" value="Save (S)" accesskey="s" /> 
 
    \t \t \t \t <input type="reset" value="Set Default (D)" accesskey="d" /> 
 
    \t \t \t </td> 
 
    \t \t </tr> 
 
    \t </table> \t 
 
    </form>

這是行不通的。

來源

2014-11-15 Axeem

這應該工作，無論HTML結構

$(document).on("keydown","input",function(event) { 
if (event.which === 13 || event.keyCode === 13) { 
    event.stopPropagation(); 
    event.preventDefault(); 
    var position = $(this).index('input'); 
    $("input").eq(position+1).focus(); 
} 
});

也是選擇：

$(document).on("keydown, keyup","input, select",function(event) { 
if (event.which === 13 || event.keyCode == 13) { 
    event.stopPropagation(); 
    event.preventDefault(); 
    var position = $(this).index('input, select'); 
    $("input, select").eq(position+1).focus(); 
} 
});

jsfiddle：http://jsfiddle.net/xh0m7pzu/1/

來源

2014-11-15 05:05:46

它怎麼也可以用'select'選項。 @A_funs – Axeem

確實在firefox和safari中工作 –

實際上我改變了它，增加了keyup，好像現在在所有的瀏覽器都可以工作 –

嘗試下面的腳本

$(document).on("keydown","input",function(event) { 
    debugger; 
    if (event.which === 13) { 
     event.stopPropagation(); 
     event.preventDefault(); 
     $(this).parents("tr").next().find("input").focus(); 
    } 
});

Demo

來源

2014-11-15 05:01:29

選擇下一個字段按回車使用jquery

回答

相關問題