コミュニティ 学ぶ ツールライブラリ レジャー
検索
日本語
ホームページ > ウェブフロントエンド > htmlチュートリアル > 本文

ドロップダウン ボックスから対応するコンテンツを表示します。 _html/css_WEB-ITnose

WBOY
リリース： 2016-06-24 12:24:41
オリジナル
2046 人が閲覧しました

比如，我有下拉框 

<select name="select">    <option>--请选择--</option>    <option value="1">显示内容1</option>    <option value="2">显示内容2</option>    <option value="3">显示内容3</option>  </select>
ログイン後にコピー


比如我选择下拉框“显示内容1”，就在右边显示内容1相关的内容。。
比如我选择下拉框“显示内容2”，就在右边显示内容2相关的内容。。

求html代码。。


回复讨论(解决方案)

右边 是什么

右边 是什么

右边就是显示的内容，随便是什么都可以。




















非常感谢。 

<!DOCTYPE html><html><head><script>function changeValue(e){if(e.selectedIndex!=0){document.getElementById("showValue").value=e.options[e.selectedIndex].text;}else{document.getElementById("showValue").value='';}}</script></head><body><select name="select" onchange="changeValue(this)">    <option>--请选择--</option>    <option value="1">显示内容1</option>    <option value="2">显示内容2</option>    <option value="3">显示内容3</option>  </select><input type="text" id="showValue" /></body></html>
ログイン後にコピー



  
  
  
      
  


  
  
  

如果要设置一个默认显示内容怎么办，比如什么都不选择的时候。。。
显示content0



  
  
  
      
  


  
  
  

比如默认请选择的情况下，下面显示一个默认的内容。？

関連ラベル：
通过下拉框来显示对应的内容。
ソース：php.cn
前の記事：css3_html/css_WEB-ITnose でこの三角形を回転させる方法 次の記事：_html/css_WEB-ITnose の問題
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
著者別の最新記事
最新の問題
エンドユーザーの現在の選択に基づいて選択ボックスから選択したオプションを移動するには、jquery スクリプトが必要です エンドユーザーが選択ボックス要素を介してアイテムをランク付けできる HTML ページがあります。簡単なデモを確認するには、フィドルを参照してください: https://jsfidd...
から 2024-04-04 18:40:04
0
1
3528
flex css - 折り返すのではなく、特定の高さの後の要素をクリップします 境界線は静的な高さと幅を表します。図のように 3 回折り返すのではなく、項目 5 と 6 を 2 行目に残し、項目 3 と 6 を切り取りたいと思います。 Flex でこれを実現す...
から 2024-04-01 14:02:02
0
1
396
動的に作成されたテキストを Javascript で編集する 「ソーシャル メディア コメント セクション」を作成しています (下部のコメント ボックスに入力して独自のコメントを追加できます)。編集ボタンをクリックすると、コメントを に変更で...
から 2024-03-31 14:17:41
0
1
364
関連トピック
詳細>
人気のおすすめ
人気のチュートリアル
詳細>
関連するチュートリアル
人気のおすすめ
最新のコース
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート