Jquery 键入时在输入字段中动态添加div

我试图模拟Zendesk在子域的注册表单中所做的工作。当用户开始键入子域时，它会自动将.zendesk.com以不同的颜色添加到用户正在键入的内容中

看起来它是另一个被定位的div，但是我不知道在用户输入时，他们是如何在输入后完美地定位它的

---

我使用的是jQuery 1.7。

一种简单的方法是，在同一位置输入镜像用户正在键入的实际输入，并在更改时将字符串添加到值的末尾

你有吗

<input class="mirrorInput" disabled="disabled"></input>
<input class="realInput"></input>​

JS是简单的

$(".realInput").on("keyup", function(event){
    $(".mirrorInput").val($(".realInput").val() + ".zendesk.com");
})

---

一种简单的方法是，在同一位置有一个输入镜像用户正在输入的实际输入，并在更改时将字符串添加到值的末尾

你有吗

<input class="mirrorInput" disabled="disabled"></input>
<input class="realInput"></input>​

JS是简单的

$(".realInput").on("keyup", function(event){
    $(".mirrorInput").val($(".realInput").val() + ".zendesk.com");
})

---

在看不到他们的页面或代码的情况下，他们是否可能将副本输入与您键入的位置对齐？它还镜像输入，并在每次击键后在字符串末尾追加.zendesk.com？这似乎是一个相对简单的方法。在看不到他们的页面或代码的情况下，他们是否有可能将副本输入与您键入的位置对齐？它还镜像输入，并在每次击键后在字符串末尾追加.zendesk.com？这似乎是一个相对简单的方法。哥们，这是一个伟大而简单的解决方案。谢谢但问题是，从键入的输入后面，镜像输入究竟是如何可见的？输入字段是透明的吗？@JoshL realInput的背景属性为none，这使它透明。很好。我没看见。love CSS3实际上找到了一个更好的方法，因为我的解决方案不允许反向制表-只需将disabled=disabled添加到mirror输入中，并将背景颜色更改为白色。伙计，这是一个伟大而简单的解决方案。谢谢但问题是，从键入的输入后面，镜像输入究竟是如何可见的？输入字段是透明的吗？@JoshL realInput的背景属性为none，这使它透明。很好。我没看见。love CSS3实际上找到了一个更好的方法，因为我的解决方案不允许反向选项卡-只需将disabled=disabled添加到mirror输入，并将背景颜色更改为白色。