同时在两个文本框上显示光标

时间:2016-04-28 11:39:24

标签: javascript jquery html

我有两个文本框,如

<input type="text" id="left" />
<input type="text" id="right" />

是否可以同时关注这两个文本框? 我不知道怎么可能。我需要同时在这两个文本框中显示光标。 如果我专注于#left,#right就会失去焦点。

注意:我正在尝试创建一个并排的Web应用程序。在单个网页上显示两个相同的视图。

我知道如何显示相同的值,我需要在两个输入上显示光标闪烁。

5 个答案:

答案 0 :(得分:2)

尝试这样做......每次改变左输入时,右边的值也会改变。

$("#left").on("input",function() {
  $("#right").val($(this).val());
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" id="left" />
<input type="text" id="right" />

答案 1 :(得分:2)

如果您要克隆输入,只需添加oninput属性即可:

<input type="text" id="left" name="left" oninput="right.value = left.value; return true;" />
<input type="text" id="right" name="right" oninput="left.value = right.value; return true;" />

不需要jQuery。按照您想要的方式自定义。这是一个小提琴:

&#13;
&#13;
<input type="text" id="left" name="left" oninput="right.value = left.value; return true;" />
<input type="text" id="right" name="right" oninput="left.value = right.value; return true;" />
&#13;
&#13;
&#13;

答案 2 :(得分:1)

你不能同时关注,但你可以像在一个文本框中写一样,同时使用jQuery或AngularJS将其绑定在其他文本框中。

答案 3 :(得分:1)

你不能,你真的不应该...... 这就像是在看电视时要求你读书。

然而,这种事情,可能在多用户和&amp;多点触控OS机器。也就是说,同一台机器上的两个用户可以在同一个表面上同时处理两个不同的任务。但是那个军队。甚至比一个用户一次只能有一个输入焦点。

答案 4 :(得分:0)

我为css找到了http://codepen.io/keilin/pen/lCkap

并补充道:

$("#left").on('keydown change', function(e) {
        $("#right").val($(this).val());
        console.log($("#right").val());
        $overlay.text($(this).val());
        var offset = $cursor.offset();
        var inputLeft = $(_this).offset().left;
        offset.left = Math.min($overlay.outerWidth(), $(_this).innerWidth() - 4);
        offset.left = inputLeft + Math.max(offset.left, 0);
        $cursor.offset(offset);
 });

如果我理解正确,你需要这样的东西:https://jsfiddle.net/8csab3t1/1/

ps:这只是一个例子。请检查两个字符。