私のページにはドロップダウンメニューがあり、テキスト入力ボックスと画像アップロードボックスがあります。テキスト入力ボックスはデフォルトで表示され、画像アップロードボックスが非表示になります。
ドロップダウンメニューに2つのアイテムAとBがあるとします。この効果を実現したいと思います。Aをクリックすると、テキスト入力ボックスが表示され、画像入力ボックスが表示されます。 Bをクリックすると、画像アップロードボックスが表示され、テキスト入力ボックスが表示されます。それを実装する方法は？
FireBugでデバッグすると、HTMLページをロードするときにクリック機能が実行されることがわずかであることがわかりました。ページがロードされたら、ドロップダウンメニュー項目をクリックすると、これらのブレークポイントは実行されません。どうしたの？
私のJSコードは次のとおりです（<head>セクションで定義されています）：
<script type = "text/javascript"> // image_uploadは、画像アップロードボックスのIDです。最初は$ $（document）.ready（function（）{$（ "＃image_upload"）。hide（）;}）; // text_onlyはドロップダウンメニュー項目です。このメニュー項目をクリックするときにこの関数にテキスト入力ボックスText_inputを実装したい//テキスト入力ボックスText_inputを表示する、画像アップロードbox image_upload $（ '＃text_only'）。ドロップダウンメニュー項目です。クリックすると、テキストボックスが非表示になり、画像アップロードボックスが表示されます。 */$（ 'image_only'）。click（function（）{$（ "＃text_input"）。hide（）; $（ "＃image_upload"）。show（）;}）; </script>完全なコードは次のとおりです。上記の情報は十分ではないことを恐れています。
<！doctype html> <html lang = "en"> <head> <title> hello、hello、world </title> <meta name = "Viewport" content = "width = device-width = 1.0"> <meta http-equiv = "content-type" content = "tex href = "css/bootstrap.css" rel = "styleSheet" screen "> <script src =" http://code.jquery.com/jquery.js "> </script> <スクリプトsrc =" js/bootstrap.min.js "> </script> <スクリプトsrc = "js/bootstrap-fileupload.js"> </script> <style> .center {width：auto; display：table; margin-top：150px; margin-right：auto;}。 url（ 'img/955.jpg'）; background-size：1440px 800px; background-repeat：no-repeat; display：compact; background-color：transparent;}。 function（）{$（ "＃image_upload"）。hide（）;}）; $（ '＃text_only'）。クリック（function（e）{$（ "＃text_input"） k（function（）{$（ "＃text_input"）。hide（）; $（ "＃image_upload"）。show（）;}）; $（ 'supperised'）。click（$（ "＃text_input"）。show（）; $（ "＃image_upload"） type = "text/javascript"> </script> </head> <body> <h1> hello、world </h1> <div> <div> <ul> <li> <a href = "＃"> home </a> </li> <li> id = "text_only" href = "＃"> text </a> </li> </ul> <li> <a data-toggle = "ドロップダウン" href = "＃"> <ul> <ul> <li> <li> <a id = "text_only" href = " data-toggle = "dropdown" href = "＃"> multimodal <b> </b> </a> <ul> <li> <a id = "supperised" href = "＃">監督</a> </li> <li> < Navbarの終わり - > <div> <form> <fieldset> <input id = "text_input" type = "text" placeholder = "placeholder =" text input "> </br> <div id =" image_upload "data-provides =" fileupload "> <！ - <入力タイプ=" hidden "value =" "" "" "" <span> </span> </div> <span> <span> select file </span> <span> change </span> <input type = "file"/> </span> <a href = "＃" data-dismiss = "fileupload"> remove </a> </div> </div> <button = "" shib "> </div> </div </body> </html>ブートストラップは、ドロップダウンメニュー項目をクリックして、新しい入力ボックスの実装コードを表示します。私はそれが誰にでも役立つことを願っています！