2

Magento ストア管理の製品詳細ページのすべての入力およびテキスト領域に文字数を追加したいと考えています。

私は jQuery に慣れていますが、可能であればデフォルトの Prototype ライブラリを使用したいと考えています。ID を使用してそれらをターゲットにする、具体的には短い説明と説明フィールドのトリックを実行するこのコードをどこかで見つけました。

Event.observe(window, 'load', function() {

Element.insert( $('short_description').up().next().down('span'), { 
    'after': "<div id='short_description_counter'>Char count: <span id='short_description_counter_num'>"+$('short_description').getValue().length+"</span></div>"
});
Element.insert( $('description').up().next().down('span'), { 
    'after': "<div id='description_counter'>Char count: <span id='description_counter_num'>"+$('description').getValue().length+"</span></div>"
});

Event.observe('short_description', 'keyup', function(event) {   $("short_description_counter_num").update(this.getValue().length);  });
Event.observe('description', 'keyup', function(event) { $("description_counter_num").update(this.getValue().length);    });
});

プロトタイプの経験がある人は、ID を指定せずに、すべての入力とテキストエリアで実行されるようにこれを編集する方法を教えてもらえますか? 使用できる each(function) がいくつかあると思います。

更新：これは、IDで指定されたテキストエリアで動作している現在のコードです - http://jsbin.com/isisur/2/edit

4

2 に答える 2

1

私のプロトタイプは錆びていますが、これはうまくいくと思います：

Event.observe(window, 'load', function() {
    $$('input[type="text"], textarea').each( function(i) {
        var my_id = $(i).readAttribute('id');
        $(i).insert({ 
            'after': "<div id='"+my_id+"_counter'>Char count: <span id='"+my_id+"_counter_num'>"+$(i).getValue().length+"</span></div>"
        });
        $(i).observe('keyup', function(e) {
            $(my_id+"_counter_num").update($(this).getValue().length);
        });
    });
});

JSFiddle

于 2013-04-09T15:53:36.537 に答える