1

2 つのテキスト フィールドがあり、最初のフィールドに数値を入力すると、2 番目のフィールドにその名前が表示されます。

「最初の」フィールドに 11 を書き込むと、「2 番目の」フィールドに「11」という単語(数字そのものではない) が自動的に配置されるはずです。また、どの数字でも同じです。

これはjQueryで実行できることは知っていますが、方法がわかりません。助言がありますか？？

4

4 に答える 4

3 
$(function() {
  $('.input').bind('keyup',function() {
     $('.output').val($(this).val());
  });
});

ここでテストできますhttp://jsbin.com/owani3

于 2010-10-01T18:54:16.430 に答える
1

任意の数のテキストボックスに対して、これは機能するはずです:

​​$(".syn").live("keyup", function() {
  var self = $(this);
  $(".syn").each(function() {
    $(this).val(self.val());
  });
})​​​​​​​​​​​​​​​

synクラスをテキスト入力に入れるだけです

于 2010-10-01T19:06:37.243 に答える
1

これは仕事をするはずです

$('#f1').live('keyup', function(){
    $('#f2').val($(this).val())
})

動作デモを確認してください: http://jsfiddle.net/E44Un/

于 2010-10-01T18:56:52.543 に答える
1

2 つの文字列を関連付けるには、以下に示すように、オブジェクトを使用して辞書/マップを作成するのが最も簡単です。

$('#input1').bind('keyup',function() {
     var map = {
         "1":"One",
         "2":"Fish",
         "3":"Bar"
     };

     $('#input2').val(map[$(this).val()]);
});

ここで実際にこれを見ることができます: http://www.jsfiddle.net/dCy6f/

より高度な動作の場合:

$('#input1').bind('keyup',function() {
     var str = '';
     var input = $(this).val();
     var intVal = parseInt(input, 10); // Dont forget the radix
     var map = {
         "1":"One",
         "2":"Fish",
         "3":"Bar"
     };

     if (intVal > 50 && intVal < 100) {
         str = 'Something';
     } else if (map.hasOwnProperty(input)) {
         str = map[input];
     }

     $('#input2').val(str);
});

この実装は、 http ://www.jsfiddle.net/H6skz/ でテストできます。

ユーザーが最初の入力フィールドへの入力を終了したときにのみ 2 番目の値を更新する場合は、"keyup" を "change" に変更します。

これを関数に抽象化するには、次のようにします。

function relate(me, withMe) {
    $(me).bind('keyup',function() {
         var str = '';
         var input = $(this).val();
         var intVal = parseInt(input, 10); // Dont forget the radix
         var map = {
             "1":"One",
             "2":"Fish",
             "3":"Bar"
         };

         if (intVal > 50 && intVal < 100) {
             str = 'Something';
         } else if (map.hasOwnProperty(input)) {
             str = map[input];
         }

         $(withMe).val(str);
    });
}

そして、次のように使用します。

relate('#input1', '#input2');

より直感的なインターフェイスを得るには、jQuery プラグインを作成します。

(function ($) {
    jQuery.fn.relate = function (withMe) {
        this.bind('keyup',function() {
             var str = '';
             var input = $(this).val();
             var intVal = parseInt(input, 10); // Dont forget the radix
             var map = {
                 "1":"One",
                 "2":"Fish",
                 "3":"Bar"
             };

             if (intVal > 50 && intVal < 100) {
                 str = 'Something';
             } else if (map.hasOwnProperty(input)) {
                 str = map[input];
             }

             $(withMe).val(str);
        });
    };
}(jQuery));

そして、次のように使用します。

$('#input1').relate('#input2');
于 2010-10-01T20:04:34.120 に答える