jquery - asp.netの自動入力テキストボックスのjquery

Question

私はasp.net 4.0でWebアプリケーションを開発しています。名前、ミドルネーム、姓のテキストボックスと表示名のテキストボックスがあります。最初にミドルネームとラストネームを入力すると、jqueryを使用して表示名テキストボックスに名前全体が表示されます

私は使っている

$(function () {
    $('input[id$=txtFName]').keyup(function () {
        var txtClone = $(this).val();
        $('input[id$=txtDisplayName]').val(txtClone);
    });
});

表示名テキスト ボックスに名、ミドルネーム、姓を連結するにはどうすればよいですか。

Answer 1

次のようなものを使用できます:
$(function () { $('input[id$=txtFName], input[id$=txtMName], input[id$=txtLName]').keyup(function () {
$( 'input[id$=txtDisplayName]').val( $('input[id$=txtFName]').val()+' '+$('input[id$=txtMName]').val()+ ' '+$('input[id$=txtLName]').val()); }); });

Answer 2

試す

$(function () {
    var concatNames = function(first, middle, last) {
        //this is locale specific 
        return first + ' ' + middle + ' ' + last;
    };
    $('input[id$=txtFName], input[id$=txtMName], input[id$=txtLName]').keyup(function () {
        var fullName = concatNames($('input[id$=txtFName]').val(), $('input[id$=txtMName]').val(), $('input[id$=txtLName]').val());
        $('input[id$=txtDisplayName]').val(fullName);
    });
});

または、すべての入力を同じクラスでマークし、クラス セレクターを使用できます。

Answer 3

3 つの名前ボックスに対してコードを 3 回繰り返して、名前を正しく連結することができます。

$(function () {
    var $fname = $('input[id$=txtFNamee]');
    var $mname = $('input[id$=txtMName]');
    var $Sname = $('input[id$=txtSName]');
    $fName.keyup(function () {
        writeName($fname,$mname,$sname);
    });
    $mName.keyup(function () {
        writeName($fname,$mname,$sname);
    });
    $sName.keyup(function () {
        writeName($fname,$mname,$sname);
    });

    function writeName($f,$m,$s){
       $('input[id$=txtDisplayName]').val($f.val() + ' ' + $m.val() + ' ' + $s.val());
    }
});