Chosen: ゼロ幅の問題の修正

＃92の複製。

私は修正時にこの変更を行う必要がありました：
if（/px/.test（this.form_field_jq.css（ "width"）））{
this.f_width = this.form_field_jq.css（ "width"）。replace（ "px"、 ""）;
} そうしないと {
this.f_width = this.form_field_jq.css（ "width"）;
}
this.form_field_jq.css（ "width"）;以降最後にpxで幅を返していました

私には解決策があり、これは私のプロジェクトでうまく機能します：

this.f_width = this.form_field_jq.outerWidth（）; //chosen.jqeury.jsのこの行の下に以下のコードを追加します

  if (this.f_width==0){ 
      var cloneObj= this.form_field_jq.clone();
      cloneObj.removeAttr('id');
      $(document.body).append(cloneObj);
      var w = cloneObj.width();
      cloneObj.remove();
      this.f_width=w;
  }

これが私のプロジェクトでうまく機能するので、誰かが役立つことを願っています。

次のCSSルールを追加しました。

.chosen-container
{
    width: 100% !important;
}

ありがとうfabioduque！ 選択したコンテナにcssを設定すると、私の問題は解決しました。

CSSで幅を設定する必要はありません。 Chosenを初期化するときに正しく実行できます。

$(".chosen-select").chosen({ width: '100%' }); // any acceptable CSS width will work

実際、選択した要素を生成するためにKO bindingHandlerを作成しましたが、すべての要素の幅が100％であるとは限らないため、CSSが最適です。 バインディングハンドラーのオプションとして幅を設定できたとしても。

ありがとう@fabioduqueそれも私のために働いた！

@pfiller 、ありがとう！ それは私の問題を解決しました。

なぜこれが時々起こるのですか？ :(

私が使用したすべての場所を選択したくなかったので、cssアプローチを使用しました（そして他の開発者は新しいビューを構築するときに同じ問題を抱えている可能性があります）。 したがって、cssは問題をグローバルに修正します。 ありがとう@fabioduque

私はWordPressプラグインの1つで条件付きロジックでこの問題に遭遇していました...特に幅が0pxに設定されています...初期化後でも（選択したフィールドをchosen:readyキューに入れるので、すでに初期化されている場合親divを非表示にします）...しかし、とにかく、これは、 chosen:updated実行する前にjQueryコードを実行して親DIV要素を表示するときにこれを修正するために使用したものです

// This is the original select field
$field = $( '#' + field );

// This is the select field wrapper that I hide (just shown for reference)
$( '.fieldset-' + field ).show();

// Chosen container ID will be original select element ID + _chosen
var $chosen_container = $( '#' + field + '_chosen' );
if( $chosen_container && $chosen_container.width() === 0 ){
    $chosen_container.css( 'width', '100%' );
}

$field.trigger( 'chosen:updated' );

他の誰かがまだこの問題を抱えている場合は、$（ "。chosen-select"）。chosen（）を呼び出しているときに確認してください。 ページの読み込み時にjavascript関数呼び出しのリストがありましたが、.chosen（）呼び出しをリストの一番上に移動すると、幅が適切に適用され、幅がゼロになりませんでした。 上に移動した関数は、いくつかのデータを取得し、多くのdom操作を実行していました。

なぜ私は2つの検索アイコンを持っているのですか、私は上記の両方の解決策を試しました-