键入时JQuery附加到文本框

JQuery Append To Textbox When Typing

本文关键字：文本 JQuery 更新时间：2023-09-26

我有3个文本框，我想创建这样的东西：当我键入textbox1时，它将复制到textbox3，当我键入text box2时，它会用分隔符（-）附加到textbox3。

例如，如果我将STACK写入文本框1，则文本框3将导致STACK，然后如果我用OVERFLOW写下文本框2，则文本盒3的值为：STACK-OVERFLOW

这是我在fiddle的代码：

$(function() {                                      
    $("#text1").keyup(function() {                 
        $('#text3').val(this.value);                 
    });
    $("#text2").keyup(function() {                 
        $('#text3').val.append('-'+this.value);                 
    });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<input type="text" id="text1" />
<input type="text" id="text2" />
<input type="text" id="text3" />

有人可以修复我的代码吗？

$(function() {                                      
    var text1value , text2value;
    $("#text1").keyup(function() {                 
        text1value = $(this).val();
        $('#text3').val(text1value);                 
    });
    $("#text2").keyup(function() {                 
        text2value = $(this).val();
        $('#text3').val(text1value+'-'+text2value);                 
    });
});

您还需要检查text2是否为空，这样在这种情况下就不必连接'-'。

JS Fiddle

$(function() {                                      
    $("#text1").keyup(function() {
        var text2 = $('#text2').val();
        var temp = $(this).val();
        if (text2 != '') {
            temp = $(this).val()+'-'+text2;
        }
        $('#text3').val(temp);                 
    });
    $("#text2").keyup(function() {   
        var temp = $('#text1').val()+'-'+$(this).val();
        $('#text3').val(temp);                 
    });
});

$(function() {                                      
    $("#text1").keyup(function() {                 
        $('#text3').val(this.value);                 
    });
    $("#text2").keyup(function(e) {                 
        $('#text3').val(function(index, val) {
            return $("#text1").val() + "-" + e.target.value;
        });
    });
});

This should do it
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<input type="text" id="text1" />
<input type="text" id="text2" />
<input type="text" id="text3" />

这是一种方法：http://jsfiddle.net/6qojd9L4/

$(function() {                                      
    $("#text1").keyup(function() {                 
        $('#text3').val(this.value + '-' + $('#text2').val());                 
    });
    $("#text2").keyup(function() {                 
        $('#text3').val($('#text1').val() + '-'+this.value);                 
    });
});