Javascript 焦点输入：插入值并将光标移动到末尾 我的目标是什么

当用户聚焦输入时：如果输入为空，则插入前缀文本并将光标移到末尾。如果他们将标签插入到输入中，它也应该起作用

上下文/演示 我正在制作一个jQuery插件，在电话号码输入旁边添加一个标志下拉列表。当用户聚焦输入时，会使用一个小前缀（所选国家的拨号代码）填充

问题

默认情况下，光标将出现在它们点击的位置，也就是在前缀的中间。我发现可以将光标移动到末尾，如果将其放入click事件处理程序中，效果会很好，但如果将tab键插入输入，则不会触发此操作。我试着把它放在焦点事件处理程序中，但是没有成功（我想是因为点击事件是在焦点事件之后触发的）

加分

---

对于一个简单、优雅的解决方案，不使用全局变量，并且尽可能少地使用事件侦听器。如果可能的话，在将光标移动到末尾之前，不要将光标显示在他们单击的位置。

这是迄今为止我提出的最佳解决方案。它勾选了所有的框，除了它不是最优雅的解决方案——我觉得我可能遗漏了一些明显的东西。理想情况下，它只需要一个事件侦听器

var input = $("input"),
  prefix = "prefix ";

input.focus(function(e) {
  if (!input.val()) {
    input.val(prefix);
  }
});

input.mousedown(function(e) {
  // mousedown decides where the cursor goes, so if we're focusing
  // we must prevent this from happening
  if (!input.is(":focus") && !input.val()) {
    e.preventDefault();
    // but this also cancels the focus, so we must trigger that manually
    input.focus();
    putCursorAtEnd(input);
  }
});

---

这里有一个。

在Firefox中，当使用Tab按钮使输入字段获得焦点时，这不适用于我。当点击输入字段时，它可以完美地工作。不幸的是，我仍然在寻找一种方法来通过标签来实现这一点。。。