jQuery将光标移动到文本输入的末尾答案

【问题标题】：jQuery move cursor to end of text inputjQuery将光标移动到文本输入的末尾
【发布时间】：2011-11-08 05:39:24
【问题描述】：

目前我有一个输入框，其值为“当前网站”

当他们点击它时，我运行这个函数：

function clearMeHttp(formfield) {
    if (formfield.defaultValue == formfield.value) {
        formfield.value = "http://";
    }
};

如果您单击该框，它可以正常工作，但是如果您进入该框，它只会突出显示“http://”这个词，这会破坏它的目的，除非他们按下我想要避免的右箭头键。

谢谢！

这是另一个代码：<input onblur="restoreMe(this)" onfocus="clearMeHttp(this)" type="text" class="fade" name="website" value="Current website">

restoreMe 只是用 jquery 将默认值淡化回来

【问题讨论】：

你在哪个事件上调用了这个函数？
<input onblur="restoreMe(this)" onfocus="clearMeHttp(this)" type="text" class="fade" name="website" value="Current website">
我不确定，但您必须为此使用 setselectionrange 函数。

标签： javascript jquery input textinput

【解决方案1】：

我稍微修改了你的代码，但是使用 jquery 事件而不是内联 html。

使用的完整脚本：

var defaultVal = 'Current website';
$(function() {

    $('.urlCheck').focus(function(e) {
        if ($(this).val() == "http://" || $(this).val() == '' || $(this).val() == defaultVal) {
            $(this).val('http://');
            $(this).select(false);

        }
    });

    $('.urlCheck').keyup(function(e) {
        if ($(this).val() == "http://" || $(this).val() == '' || $(this).val() == defaultVal) {
            $(this).val('http://');
        }
    });

    $('.urlCheck').blur(function(e) {
        $(this).val(defaultVal);
    });

});

工作链接：http://jsfiddle.net/29gks/6/

keyup 事件是 Chrome 和 Safari 的覆盖

【讨论】：

让我知道它是否适合您.. 忙着寻找适用于 Chrome/Safari 的有效取消选择解决方案。
是否可以在他们进入框中并在显示 http:// 之后模仿右箭头功能？我不介意他们是否可以删除它或其中的任何一个（如果他们真的想要他们可以退格）。只要它不突出我很高兴。禁用标签并不理想
:) 这实际上是我目前正在查看的内容。会尽快通知您。
我已经更新了我的答案。使用 keyup 事件并设置值修复了 Chrome/Safari 问题。

【解决方案2】：

你没用过jquery，所以我跟着你。

脚本：

function clearMeHttp(formfield) {
    if (formfield.defaultValue == formfield.value) { 
         formfield.value="";        
         formfield.style.padding="0 0 0 40";
         document.getElementById("http").style.display="block";
    }
};

html:

<label id="http" style="float:left;position:absolute;display:none;">http://</label>
<input onblur="restoreMe(this)" onfocus="clearMeHttp(this)" type="text" class="fade" name="website" value="Current website">

这符合您的要求，但可能不是您想要的方式

【讨论】：

抱歉，我标记了 jquery，因为我认为其中可能内置了一个函数来简化它。不幸的是，我已经使用了很多标签，所以它必须没有那个方法。

【解决方案3】：

您需要在大多数浏览器上使用setSelectionRange()（或selectionStart 和selectionEnd），在IE TextRange 恶作剧。

这是我之前对同一问题的回答：How to place cursor at end of text in textarea when tabbed into

【讨论】：