实时复制另一个文本框值 Jquery

Copy another textbox value in real time Jquery

本文关键字：Jquery 文本 复制 另一个 实时      更新时间：2023-09-26

我想获取另一个文本框的值并将其实时输入到另一个文本框中。如何检测TEXT_3是否已更改？如果TEXT_3值更改，则必须将其输入到TEXT_4为方便起见，以下是代码和演示：

**HTML**
    <label>TEXT 1: </label><input type="text" id="text_1" value=""/>
    <label>TEXT 2: </label><input type="text" id="text_2" value=""/>
    <label>TEXT 3: </label><input type="text" id="text_3" value=""/>
    <label>TEXT 4: </label><input type="text" id="text_4" value=""/>
**JAVASCRIPT**
    /* INPUT TEXT_1 AND TEXT_2 VALUE TO TEXT_3 ON TEXT_1 KEYUP*/
    $("#text_1").keyup(function() {
        $("#text_3").val($("#text_1").val() + " " + $("#text_2").val());
    })
    /* INPUT TEXT_1 AND TEXT_2 VALUE TO TEXT_3 ON TEXT_1 AND TEXT_2 KEYUP*/    
    $("#text_2").keyup(function(){
        $("#text_3").val($("#text_1").val() + " " + $("#text_2").val());
    })
    /* HOW CAN I  DETECT IF TEXT_3 WAS CHANGED? IF TEXT_3 VALUE CHANGED, IT MUST BE INPUTTED TO TEXT_4*/
    /* not working solution */   
    $("#text_3").change(function(){
        $("#text_4").val($("#text_3").val());
    })

演示：http://jsfiddle.net/8eXRx/7/

感谢您的回复！

在 textbox3.val(( 之后添加 change((，如下所示：

$("#text_1").keyup(function() {
    $("#text_3").val($("#text_1").val() + " " + $("#text_2").val()).change();
})
/* INPUT TEXT_1 AND TEXT_2 VALUE TO TEXT_3 ON TEXT_1 AND TEXT_2 KEYUP*/    
$("#text_2").keyup(function(){
    $("#text_3").val($("#text_1").val() + " " + $("#text_2").val()).change();
})

http://jsfiddle.net/8eXRx/12/

问题是您无法绑定特殊事件来检查文本框值是否使用 JavaScript 而不是手动更改。要解决该任务，一种选择是对text_1和text_2使用相同的keyup事件。JQuery 会将新的处理程序添加到现有处理程序中：

$("#text_1, #text_2").keyup(function(){
    $("#text_4").val($("#text_3").val());
})

演示：http://jsfiddle.net/8eXRx/11/

change事件在输入字段失去焦点后触发。如果你想实时更新它，你还需要keyup事件，所以像这样：

$("#text_3").keyup(function(){
    $("#text_4").val($("#text_3").val());
})

尝试：

$("#text_3").keyup(function(){
   cur_val = $(this).val(); //grab #text_3's current value
   $(this).val(cur_val); // this is optional, but keep for sake
   $("#text_4").val(cur_val); //set #text_4's value as what #text_3 is having
});

试试这个.. n1 和 n2 是 textbox 的 id 

 $(document).ready(function(){
    $(':input').keyup(function(){
      $("#n2").val($("#n1").val()).change(); 
    });
});
相关文章：