如何在Google Chrome輸入文本末尾設置光標位置

我試圖在具有焦點功能的文本字段中設置光標。我做了一些研究，但所提供的解決方案似乎都不適用於Google Chrome。在Internet Explorer和Firefox這個解決方案是工作的罰款：如何在Google Chrome輸入文本末尾設置光標位置

的JS：

$('#Search').focus(function() { 
    var SearchInput = $('#Search'); 
    var strLength= SearchInput.val().length; 
    SearchInput.focus(); 
    SearchInput[0].setSelectionRange(strLength, strLength); 
});

的HTML：

<input type="text" id="Search" value="Hello World" />

這裏的鏈接到我的jsfiddle。

有什麼辦法可以在谷歌瀏覽器中進行這項工作嗎？

來源

2014-02-19 Guilherme Vaz

好像焦點事件，當你專注的輸入光標位於前發射，哈克解決方法是使用的setTimeout像這樣：

$('#Search').focus(function() { 
    setTimeout((function(el) { 
     var strLength = el.value.length; 
     return function() { 
      if(el.setSelectionRange !== undefined) { 
       el.setSelectionRange(strLength, strLength); 
      } else { 
       $(el).val(el.value); 
      } 
    }}(this)), 0); 
});

試試這個小提琴：http://jsfiddle.net/esnvh/26/

編輯爲0ms超時，因爲@SparK指出這足以推送到執行隊列的末尾。

來源

2014-02-19 13:37:28 ruuska

感謝您的答案！我沒有想到！它似乎工作得很好。我會在我的項目上嘗試這種方法。 –

工程就像一個魅力！我會標記你的答案。非常感謝！ –

很高興我能幫忙，更新回答非Chrome瀏覽器的回退。請參閱@ Paul-Rad-Dupuy回答 – ruuska

使用該鼠標鬆開事件：

$("#Search").mouseup(function() { 
    this.setSelectionRange(this.value.length, this.value.length);  
});

來源

2014-02-19 13:21:02

這似乎工作，但如果我有更多的文本字段，並開始用Tab鍵導航他們呢？真正的事情是我試圖用錢面具領域。 –

更新代碼

參考：http://css-tricks.com/snippets/jquery/move-cursor-to-end-of-textarea-or-input/

setSelectionRangeis not supported在IE，歌劇& Safari瀏覽器

我建議你做的東西像這樣（適用於IE， Chrome，Safari，Firefox）。

$('#Search').on('mouseup', function() { 
    var element = $(this)[0]; 
    if (this.setSelectionRange) { 
     var len = $(this).val().length * 2; 
     element.setSelectionRange(len, len); 
    } 
    else { 
     $(this).val($(this).val()); 
     $(this).focus(); 
    } 
    element.scrollTop = 9999; 
});

試試這個：http://jsfiddle.net/r5UVW/4/

來源

2014-02-19 13:22:40

你鏈接到錯誤的JSfiddle我認爲 – spassvogel

感謝您的答案！我試過了你的代碼，但它似乎並不適用於Chrome。只有我嗎？ –

更新小提琴演示;-) –

僅供參考，目前輸入的數字不支持setSelectionRange()，所以快速解決方法是使用.select()簡單選擇文本。在桌面瀏覽器上，這突出顯示了文本，在移動設備上，這將光標直接移動到文本的末尾。

來源

2016-05-27 12:57:39 DanV

如何在Google Chrome輸入文本末尾設置光標位置

回答

相關問題