1

動的に入力されるjqueryボタンセットがあります。唯一の問題は、動的に追加されたボタンが多すぎると、次の行に折り返され、適切に行われないことです。表示内容は次のとおりです。
(element a|about|us|lorem|
|ipsum|and|done)

これに関する主な問題は、1 行目の右端の要素と 2 行目の左端の要素の角が丸くなく、他のすべてのボタン要素と同様に角が四角いことです。ボタンセットの最初または最後の位置。とにかくそのような表示を得る方法はありますか？
(element a|about|us|lorem)
(ipsum|and|done)

ありがとう！

4

2 に答える 2

2

ピーターが言ったように使用offset()することは間違いなく正しい方向です。適切な要素を見つけたら、.ui-corner-rightおよび.ui-corner-leftクラスを追加するだけです。

$("#box label").each(function(){   //loop through all the labels for the buttons
    var self = $(this);
    if( self.offset().top > self.height() ){ //find the first element on the second line
        self.addClass("ui-corner-left")
        .prev().prev().addClass("ui-corner-right") // move to the previous label on the above line
        return false;  // break out of the .each
   }
});

http://jsfiddle.net/KEfau/ もちろん、これは 2 行にあるものに対してのみ機能し、.each() 内の条件はレイアウトによって異なる場合があります。ボタンの複数行の場合、行の現在の上部オフセットを格納する変数があり、要素が一致しない場合はクラスの追加を行います。

于 2012-08-27T16:43:09.927 に答える
0

jQuery offset（）を使用して改行を検出し、ブレーク前のアイテムを最後と同じクラスに設定し、ブレーク後のアイテムを最初のクラスと同じクラスに設定することができます。これが機能するかどうかはわかりませんが、要素がどのように角を丸くするかによって異なりますが、jQuery-uiについてはあまり詳しくありません。

于 2012-08-03T18:35:22.830 に答える