0

私は2つのテーブルを持っています。あるテーブルの値を別のテーブルにミラーリングしたい。私が持っている現在の実装はこれです：

   <script type="text/javascript">  
        $("#textfield1, #textfield2, #textfield3, #select1").on("keyup keypress blur click change", function(event){        
            $("input[type='text']#copytextfield1").val( $("[type='text']#textfield1").val() );
            $("input[type='text']#copytextfield2").val( $("[type='text']#textfield2").val() );
            $("input[type='text']#copytextfield3").val( $("[type='text']#textfield3").val() );
            $("input[type='text']#copytextfield4").val( $("select#select1").val() );        
        });         
    </script>

ご覧のとおり、名前は非常に似ています。唯一の違いは、ミラーリング要素に「コピー」があることです。これをより効率的にする方法を提案できますか？たぶん命名規則を利用しますか？

4

2 に答える 2

2

次のように実行できます。

   <script type="text/javascript">  
        $("#textfield1, #textfield2, #textfield3, #select1").on("keyup keypress blur click change", function(event){
            for (var i = 1; i <= 3; i++) {
                $("#copytextfield" + i).val( $("#textfield" + i).val() );
            }
            $("input[type='text']#copytextfield4").val( $("select#select1").val() );        
        });         
    </script>

ただし、選択の ID は問題を引き起こすため、代わりにすべてのフィールドの ID を input1 - input4 のようなものに変更すると、さらにリファクタリングされる可能性があります。

    <script type="text/javascript"> 
        $("#input1, #input2, #input3, #input1").on("keyup keypress blur click change", function(event){
            for (var i = 1; i <= 4; i++) {
                $("#copytextfield" + i).val( $("#input" + i).val() );
            }       
        });         
    </script>
于 2012-06-30T12:17:05.553 に答える
0

これを試してみてください:あなたのためにデモも作成しました: http://jsfiddle.net/6hwLS/4/

アイデアは、数値を最後から取り出して$(this)オブジェクトで使用することです。

また、一意である必要はなくinput[type='text']、DOM 要素を一意に識別します。selectid

お役に立てれば、:)

このような：

$("#textfield1, #textfield2, #textfield3, #select1")
    .on("keyup keypress blur click change", function(event) {

        var theNum = parseInt($(this).attr("id").match(/\d+$/)); // will return last numeric value

         $("#copytextfield"+theNum).val($("#textfield"+theNum).val());      
         if( theNum === 4) {
            $("#copytextfield"+theNum).val($("#select1").val());
        }
}); ​
于 2012-06-30T12:17:15.087 に答える