Javascript jQuery val（）无法在Chrome中使用插入符号逻辑

我正在使用一个输入字段，我已经为它映射了键码，这样键盘输入将在输入字段中呈现不同的语言字符

问题在于，当字符到达输入“视图”的末尾时，使用jQuery val（）方法的“映射”字符的任何其他输入都不会被解释为来自浏览器的键输入，因此最后输入的字符始终可见

所以我必须添加插入符号逻辑（JSFIDLE中的底部输入使用插入符号逻辑），但这在Chrome/（webkit？）上不起作用

下面是我的示例的一部分

编辑：我测试了以下版本，可以在FF中使用，但不能在Chrome中使用

Mac Snow Leapperd OSX 10.6.7

铬：V11.0.696.68，V11.0.696.71-不工作

Firefox:4.0.1-works

Windows Chrome:-v不确定-不工作

我不确定如何解决这个问题，有什么想法吗？

---

谢谢

如果您保存并添加到输入的

滚动左

位置，它将更新并保留键入的字符。但是，如果在输入中间单击并开始键入，则失败。

我用下面的代码更新了第二个输入。还请注意，添加的输入和测试范围应具有相同的字体大小

input_2.bind('keydown.keyboard', function(e) {
    var key = "",
        current_val = input_2.val(),
        pos = input_2.caret(),
        start_pos = pos.start,
        end_pos = pos.end,
        scroll = $(this).scrollLeft();

    // some mapped keys
    switch (e.which) {
        // e key
    case 69:
        key = "ε";
        e.preventDefault();
        break;
        // f key            
    case 70:
        key = "φ";
        e.preventDefault();
        break;
        // z key                
    case 90:
        key = "ζ";
        e.preventDefault();
        break;
        // a key
    case 65:
        key = "α";
        e.preventDefault();
        break;
    }

    if (key !== '') {
        var test = $('<span class="test">&nbsp;' + key + '</span>').appendTo('body');
        scroll += test.width();
        test.remove();
    }

    input_2.val(current_val + key);
    //Insert/Replace text at caret then restore caret        
    input_2.value = current_val.substr(0, start_pos) + key + current_val.substr(end_pos, current_val.length);
    input_2.caret(start_pos + key.length, start_pos + key.length);
    if (key !== '') {
        $(this).scrollLeft(scroll);
    }

});

input_2.bind（'keydown.keyboard'，函数（e）{
var key=“”，
当前值=输入值2.val（），
pos=输入_2.插入符号（），
开始位置=开始位置，
结束位置=结束位置，
scroll=$（this.scrollLeft（）；
//一些映射键
开关（e.which）{
//e键
案例69：
key=“ε”；
e、 预防默认值（）；
打破
//f键
案例70：
key=“φ”；
e、 预防默认值（）；
打破
//z键
案例90：
key=“ζ”；
e、 预防默认值（）；
打破
//钥匙
案例65：
key=“α”；
e、 预防默认值（）；
打破
}
如果（键！=''）{
var测试=$（''+键+''）。附加到（'正文'）；
滚动+=test.width（）；
测试。移除（）；
}
输入2.val（当前值+键）；
//插入/替换插入符号处的文本，然后恢复插入符号
输入值=当前值substr（0，开始值）+键+当前值substr（结束值，当前值长度）；
输入2.插入符号（起始位置+键长，起始位置+键长）；
如果（键！=''）{
$（此）。向左滚动（滚动）；
}
});

---

---

更新：scrollLeft的位置似乎有点不对劲，所以如果你在span中添加一个

字符，效果会好得多（）

它在Chrome中对我有效。。。v 11.0.696。68@Fosco你确定你的测试正确吗？为了正确测试，我这里有很多行话：P我在许多计算机上用Chrome在Windows和Mac上进行了测试，并验证了我的示例不起作用。@Pointy Safari也不起作用-v 5.0.5它在Firefox或Chrome的Linux上都不起作用。我在Windows上用Chrome 11进行了测试，虽然它确实起作用，但感觉有点不舒服不可预测（即样式和DOM结构总是不同的），我希望找到一种解决方案，不必添加DOM节点和计算字体宽度，因为动态可能会因站点而异。好的。因此，使用您的scrollLeft想法，我通过计算输入中fontSize的宽度，使其更具动态性。这里是工作链接…jsfiddle.net/dwickwire/S9EKN/25非常感谢！测试铬-v 11.0.696.71 FF 4.0.1、Safari 5.0.5、IE6、IE9、IE9 comp模式，用于IE7所有工作。