1

jQuery Chosenを使用して作成されたユーザーフレンドリーな複数選択があります。複数の要素を選択すると、複数選択コンテ​​ナー div の高さが増加します。コンテナ div がフォーカスされている場合にのみ、この高さを維持したいと考えています。ただし、焦点が合っていない場合は、固定の高さを取得します。

フォーカスがある場合 (height:auto):
ここに画像の説明を入力

その他 (高さ:40px):
ここに画像の説明を入力

これは私がしたことです：

$('.chosen-container-active .chosen-choices').live('focus',function(){
    var autoHeight = $(this).css('height', 'auto').height();
    $(this).height(40).animate({height:autoHeight},300);
}).live('blur',function(){
    if($(this).val() == '') {
        $(this).animate({height:50},300);
    }
});

これはうまくいきますが、すべての要素を選択することはできません。私は何を間違えましたか？
jsフィドル

助けてくれてありがとう！

4

1 に答える 1

0

次のように問題を解決しました。

$('.chosen-container-multi').live('focus', function(event) {   
    var select = $('.chosen-container-multi').find(".chosen-choices");
    var curHeight =  select.height();
    var autoHeight = select.height();

    curHeight = select.height();
    autoHeight = select.css('height', 'auto').height();
    select.height(curHeight).animate({height: autoHeight}, 300);

    event.stopPropagation();
}).live('blur',function(){
    $('.chosen-container-multi').find(".chosen-choices").animate({height: 30}, 300);
});

jsフィドル

しかし、オプションを選択すると、高さが 30px にアニメーション化されてから auto が返されます (2 つ以上の要素を選択するため)。この動作を防ぐにはどうすればよいですか?

于 2013-10-14T10:48:28.443 に答える