始終在文本框

我寫一個網頁，將只有1頁面上的文本框，並顯示信息的文本光標設定由於給定的數據。始終在文本框

我們的計劃是，我們將使用條碼掃描器或磁刷卡和觸摸屏顯示器的特殊頁面。當學生卡被掃描時，它將自動回發並從數據源中檢索數據並顯示在網頁上。我們構建了示例頁面，並設法使其與真實數據一起工作。

的樣品數據可以是一個條形碼或磁性刷卡數據。

Sample Barcode Data - ?300203623; 
Sample Magnetic Swiped Data - ;30020362300203622016?

兩個輸入設備（條形碼掃描儀和磁條）自動附加輸入密碼。如果你願意，你可以禁用它。由於我們希望在掃描/刷卡後將其發回，我們寧願將Enter鍵保持原樣。

的問題是，當用戶不小心點擊網頁上的任何地方，文本框失去焦點和當卡被掃描或再次刷卡，它不會做任何事情。由於文本框丟失了焦點，並且掃描的數據不會被插入到文本框中，並且也不會將回發到服務器。

我寫的JavaScript將焦點重新設置文本框（ID：參考）時，它失去焦點。我可以在控制檯上看到console.log行。但它並沒有把重點放在文本框上。我在FF，Chrome & IE上測試過但同樣的問題。

$('#Reference').focusout(function() { 
    console.log('on focusout' + new Date()); 
    $('#Reference').focus(); 
});

我的第一個問題是，我怎麼可以重新專注於文本框時，它失去焦點。

其次，我們在做正確的事情？如果我們想在未來添加'圖片'或'鏈接'觸摸/點擊怎麼辦？如果我們繼續強調文本框的話，會不會影響？

如果考慮一個更好的辦法，請隨時給我建議。

來源

2016-11-02 TTCG

爲什麼就不能在處理該掃描卡代碼的開頭添加文本框的強制焦點？ –

我做到了，但在帖子中省略。回發之後，我也將焦點重置迴文本框。問題是我無法控制用戶不要點擊/觸摸頁面上的其他區域。 – TTCG

我只是想你的代碼 - 它在Chrome中工作，但適用於Firefox，我需要把它包在超時：

$('#input').focusout(function() { 
 
    console.log('on focusout' + new Date()); 
 
    setTimeout(function() { 
 
     $('#input').focus(); 
 
    }); 
 
}); 
 

 
$('#form').submit(function(event) { 
 
    console.log("submit", $("#input").val()); 
 
    event.preventDefault(); 
 
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<form id="form"> 
 
<input type="text" id="input"> 
 
</form>

來源

2016-11-02 20:57:43

是的，它可以工作...但它會禁用自動回發功能，並且不能按回車鍵回覆到文本框中。 < - 忽略我......現在一切正常。謝謝。 – TTCG

你能否編輯你的問題，它提供了一些關於回發如何工作的更多信息？掃描/刷卡的行爲是否像鍵盤輸入一樣？如何觸發服務器觸發？ –

正如所建議的，已更新問題 – TTCG

有了模糊的，而不是事件的內容，它的工作對我來說（使用普通的JavaScript，而應該用jQuery工作太）：

HTML

<textarea id = 'txt'></textarea>

的Javascript

document.getElementById("txt").addEventListener("blur", function(e){ setTimeout(function(){e.target.focus();}, 0); });

http://codepen.io/sergio0983/pen/bBbYzK

來源

2016-11-02 21:00:07 sergio0983

更改它以添加setTimeout，通常有助於焦點/遮罩的東西 – sergio0983

始終在文本框

回答

相關問題