只讀<input>阻止爲不同元素添加值

Question

我有一系列<input>元素和一個對應的腳本，可在鍵入後自動對焦下一個框。另外還有一個只讀的元素，純粹爲用戶提供上下文。

只讀元素可以防止在#DialFifth中輸入值。我試圖使用屬性選擇器來防止只讀元素，但這似乎不起作用。

請參閱片段 - 任何想法？

$(':input').keypress(function() { 
 
    $(this).next(':input').focus(); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input id="DialFirst" name="DialFirst" type="text" value="" /> 
 
<input id="DialSecond" name="DialSecond" type="text" value="" /> 
 
<input id="DialThird" name="DialThird" type="text" value="" /> 
 
<input id="DialFourth" name="DialFourth" type="text" value="" /> 
 
<input id="DialFifth" name="DialFifth" type="text" value="" /> <!--Unable to type into this box--> 
 
<input id="DialFinal" name="DialFinal" type="text" readonly="readonly" value="0" />

Answer 1

的問題是，在該值被改變，而該事件觸發順序做。要做到你需要什麼，可以使用keyup代替：

$(':input').keyup(function() { 
 
    $(this).next(':input').focus(); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input id="DialFirst" name="DialFirst" type="text" value="" /> 
 
<input id="DialSecond" name="DialSecond" type="text" value="" /> 
 
<input id="DialThird" name="DialThird" type="text" value="" /> 
 
<input id="DialFourth" name="DialFourth" type="text" value="" /> 
 
<input id="DialFifth" name="DialFifth" type="text" value="" /> 
 
<input id="DialFinal" name="DialFinal" type="text" readonly="readonly" value="0" />