[解決済み] Materialize CSS - セレクトがレンダリングされないようです。
2022-02-02 01:57:19
質問
現在、Materialize CSSを使用していますが、selectフィールドでつまづいたようです。
私は彼らのサイトから提供された例を使っていますが、残念ながら、それはビューでレンダリングされていないです。 誰か助けてくれる人がいればと思います。
私がやろうとしていることは、パディングを提供する2つの端のスペーサーを持つ行を作成し、内側の2つの行アイテム内に検索テキスト入力と検索選択ドロップダウンがあるようにすることです。
これは私が作成した例です。 http://materializecss.com/forms.html
よろしくお願いします。
以下は問題のコードのスニペットです。
<div class="row">
<form class="col s12">
<div class="row">
<div class="input-field col s2"></div>
<div class="input-field col s5">
<input id="icon_prefix" type="text" class="validate" />
<label for="icon_prefix">Search</label>
</div>
<div class="input-field col s3">
<label>Materialize Select</label>
<select>
<option value="" disabled="disabled" selected="selected">Choose your option</option>
<option value="1">Option 1</option>
<option value="2">Option 2</option>
<option value="3">Option 3</option>
</select>
</div>
<div class="input-field col s2"></div>
</div>
</form>
解決方法は?
ブラウザのデフォルトを上書きするため、セレクトスタイリングの実行にはJavascriptが必要です。MaterializeのJavascriptファイルをインクルードし、その中で
$(document).ready(function() {
$('select').formSelect();
// Old way
// $('select').material_select();
});
を読み込んだ後、そのファイルを
関連
-
[解決済み】フォームコントロールの値アクセサがない
-
[解決済み】webpack: モジュールが見つかりません。Error: 解決できない(相対パスで)
-
[解決済み】「Uncaught TypeError: Chromeで "Illegal invocation "が発生する。
-
[解決済み】Uncaught ReferenceError。Firebase は定義されていません。
-
[解決済み] CSSの親セレクタはありますか?
-
[解決済み] CSSでcellpaddingとcellspacingを設定する?
-
[解決済み] CSSでテキストや画像の背景を透明にするには?
-
[解決済み] How do I style a <select> dropdown with only CSS?
-
[解決済み] JavaScriptでテキスト入力フィールドの値を取得するにはどうすればよいですか?
-
[解決済み】HTML5入力のプレースホルダの色をCSSで変更する。
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み】Javascript:getElementById対getElementsById(両方が別のページで動作する)。
-
[解決済み】Uncaught TypeError: nullのプロパティ'value'を読み取ることができない
-
[解決済み] Uncaught Invariant Violation: 前のレンダリング中よりも多くのフックをレンダリングした
-
[解決済み】JavaScriptのisset()に相当するもの
-
[解決済み】JavaScriptのボタンonclickが機能しない
-
[解決済み】SyntaxError: ChromeのJavascriptコンソールでUnexpected Identifierが発生する。
-
[解決済み】Uncaught TypeError: 未定義のプロパティ 'msie' を読み取れない - jQuery tools
-
[解決済み】未定義のプロパティ 'forEach' を読み取ることができない
-
[解決済み】Vueが定義されていない
-
[解決済み】Javascript、[オブジェクトHTMLInputElement]を表示中。]