Javascript退格功能

我需要實現退格鍵行爲，以便將光標置於左側一個位置，而不需要用戶按下Backspace鍵，而是在我的（contenteditable）div內以編程方式添加字符串後，我需要會自動移動一個位置。我嘗試將\ b添加到我的字符串中，但沒有成功。我如何實現這種行爲（最好使用Javascript）？Javascript退格功能

謝謝！

來源

2012-10-15 Crista23

通過將瀏覽器事件注入到可編輯的內容中，您可以輕鬆解決此問題。我用左箭頭鍵顯示了一個例子，因爲你寫了你想要移動光標，我希望這是你想要的，因爲Backspace會刪除一個字符。如果你想刪除，然後用退格鍵替換左側的鍵碼。

這裏是它是如何使用jQuery做：

var ev = jQuery.Event("keydown"); // Creates a new keydown event 
ev.keyCode = $.ui.keyCode.LEFT; // Sets the event keyCode to be the left arrow button 
$('#contentEditableContainer').trigger(ev);

要包括jQuery的：

<head> 
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script> 
</head>

來源

2012-10-15 10:06:29

嗨康斯坦丁！謝謝您的回答。我是新來的jQuery和使用jQuery 1.6.4我得到一個錯誤，說jQuery是未定義的。我應該包括什麼？非常感謝！ – Crista23

@ Crista23我使用include更新了我的帖子。 –

謝謝你的回答，但仍然沒有得到預期的結果。正如我在另一個SO帖子中發現的，似乎這個解決方案不能模擬HTML元素上的自然按鍵事件。此方法僅觸發keydown事件，它不會複製進入元素的用戶並按需要按下該鍵。 – Crista23

這裏是我使用的功能，請確保您有jQuery的。只需將此函數帶有一個id代表您希望退格行爲的文本框：

function backSpace(id){ 
var txt = $(id); 
var startPos = txt[0].selectionStart; 
var endPos = txt[0].selectionEnd; 
var scrollPos = txt[0].scrollTop; 
console.log("start: " + startPos + " end: " + endPos + " scrollPos: " + scrollPos); 
if (endPos - startPos > 0){ 
    txt.val(txt.val().slice(0, startPos) + txt.val().slice(endPos, 100)); 
}else if (endPos > 0){ 
    txt.val(txt.val().slice(0, startPos-1) + txt.val().slice(startPos, 100)); 
}else{ 
    startPos = txt.val().length+1; 
} 
txt.focus(); 
txt[0].setSelectionRange(startPos-1,startPos-1); 
}

來源

2017-02-21 17:56:50

Javascript退格功能

回答

相關問題