仅应用于文本的文本框的 CSS 背景色

Question

我有两个相互重叠的文本框。第一个文本框“TextBox1”由用户输入定义。第二个“TextBox2”由自动完成功能填充。我的目标是让第一个文本框的背景仅对于已键入的文本为白色，以便生成的“TextBox2”仅显示返回的帐户名称的其余部分。

示例:用户键入“ut tr”，存储在“TextBox2”中的自动完成变为: “UT培训”。我有一个文本转换以将每个单词的第一个字母大写，因此在转换后(当用户键入)“Ut Tr”时。

当输入与“TextBox2”中的结果重叠时，由于字母大小写的不同，两者不匹配。在其他示例中，这可能会导致严重的外观问题。

因此，如果输入文本框“TextBox1”的文本背景可以是白色，则用户只会看到他们输入的内容，以及自动完成的其余部分。

感谢您的帮助!这是我的第一篇文章，如果我在不知不觉中做了一些禁忌，我深表歉意。

这是一个视频链接，展示了它的外观:http://screencast.com/t/ef6dBJyU2X14

Answer 1

您可以检查用户现在输入了多少个字符，方法类似于:

$('#myInput').on('keydown', function() {
    inputLength = $(this).val().length
});

然后将自动完成中第一个 N = inputLength 个字符的颜色更改为白色。可能，使用子字符串:

substring(0, inputLength);