1

以下を使用すると、選択した入力の幅をピクセル単位で取得できます。選択リスト内のオプションの幅を取得することは可能ですか？ありがとう

$('#mySelect').width();

更新-これが私がこれを望む理由です。選択リストの中央にテキストを配置する必要があります。css text-align：center;を使用してこのクロスデバイスとブラウザーを実行することはできません。私の唯一のオプションは、テキストインデントを使用することです。私のサイトには液体の幅があり、オプションの長さが異なるため、この値を動的に計算する必要があります。

したがって、選択オプションのテキストの幅を取得でき、コンテナの幅も取得できれば（はるかに簡単）、テキストのインデントを計算できます。ありがとう

NimChimpskyの方法はうまく機能しているようです。コードはここにあります：jQuery-関数はdivクリックで起動されたときに正常に実行されますが、ページの読み込みでは実行されません

4

4 に答える 4

0

次のように、選択したオプションの文字列の長さを取得できます。

 ("#mySelect option:selected").text().length

特定のインデックス要素 (ここでは 2) に対して、次のようにします。

$("#mySelect option[value='2']").text().length

または、選択したテキストを取得して非表示の div に配置し、通常の jquery width メソッドを使用して、その div の幅を取得することもできます。

于 2012-05-14T14:12:01.180 に答える
0 
$('#mySelect > option').width();

これは実際には最初のオプションの幅を返します。より選択的な jQuery セレクター文字列を使用して、適切なオプション タグを選択します。

于 2012-05-14T14:12:53.123 に答える
0

選択したアイテムに必要な幅だけを拡大および縮小する、可変幅の HTML セレクター タグを作成する方法を次に示します。ブラウザの互換性は、iOS8 の Safari でのみ必要だったのでテストしていませんが、可能であると確信しています。

セレクターのHTML

<select id="hack1">
    <option>short option</option>
    <option>loooong looking loooong option</option>
    <option>Longer option but more like the longest</option>
    <option>Medium length selector</option>
</select>

下部の HTML

<select id="hackselect">
    <option></option>
</select>

CSS

#hackselect {
    visibility: hidden;
}

jQuery

$('#hack1').change(function(event) {
    $("#hackselect option:first").text($("#hack1 option:selected").text());
    $('#hack1').css('width', $('#hackselect').width() + 6);
});

コードの最後の行に + 6 があるのは、select 要素にカスタム スタイルがあり、両側に 3 つのパディングがあるためです。幅を測定する場合、これは考慮されないため、ハードコードする必要があります。

于 2015-01-08T06:46:14.863 に答える