0

私はグーグルで見つけた既成のリストと、roberkules(http://stackoverflow.com/questions/5409780/html-country)によってstackoverflowに投稿されたpngスプライトのフラグを特定するスマートな方法を使用して国セレクターを構築しています-list-with-flags)。

私は初心者であり、各部分がどのように機能するかを理解している限り、jQueryにISOコードを読み取らせて各国に適用する方法を理解していません。私はまた、最初の国に追加<i></i>して、少なくともスペイン国旗が表示されるかどうかを確認しましたが、何も表示されませんでした。

!同様の質問があることは承知していますが、手動のcss座標を使用しており、このJavaScriptのメソッドで機能するようにしたかったのです。

(function($) {
// size = flag size + spacing
var default_size = {
    w: 20,
    h: 15
};

function calcPos(letter, size) {
    return -(letter.toLowerCase().charCodeAt(0) - 97) * size;
}

$.fn.setFlagPosition = function(iso, size) {
    size || (size = default_size);

    return $(this).css('background-position',
        [calcPos(iso[1], size.w), 'px ', calcPos(iso[0], size.h), 'px'].join(''));
};
})(jQuery);

// USAGE:

(function($) {

$(function() {
    // on load:
    $('.country i').setFlagPosition('es');

});

})(jQuery);​

http://jsfiddle.net/3TvWs/私が今いるところです。

誰かが助けてもらえますか、ほんのヒントでも?

編集:申し訳ありませんが、私はこれをひどく説明したことに気づきました。(旗)スペインは、ピンポイントがどのように機能するかの一例にすぎません。私は実際には旗がドロップダウンの中にあり、そのスペインの泡がまったくないことを意味しました。誤解してすみません。

4

1 に答える 1

0

ドロップダウンメニューイベントで変更イベントをリッスンして呼び出すようにイベントハンドラーを設定しますsetFlagPosition

$('select[name="country"]').on('change', function(){
    $('.country i').setFlagPosition($(this).val())[0].nextSibling.nodeValue = $(':selected', this).text();
});

http://jsfiddle.net/mowglisanu/3TvWs/1/

于 2012-12-02T02:23:33.730 に答える