Bootstrap ポップアップ ダイアログ ボックスの作成について質問する_html/css_WEB-ITnose

Bootstrap Web ダイアログ

Web 検索プログラムを作成し、Bootstrap を使用してポップアップ ダイアログ ボックスを作成しました。ダイアログ ボックスがホームページに表示されるとき、検索をクリックすると、ブートストラップのデフォルトの黒の背景と白のボックスになります。結果ページ、ページ全体 背景がすべて黒です 何が起こっているのでしょうか? 2 つのページで参照されている JS ファイルと CSS ファイルは同じであり、ポップアップ ダイアログ ボックスはすべて JSP ファイルを参照しています。どうすればいいですか？ 2 つのページのポップアップ ダイアログ ボックスは次のとおりです:


ダイアログ ボックスを導入するコードは次のとおりです:

<form name="form2" action="GetCategory.action" method="get" id="search" class="form-inline">                 <a style=" vertical-align:middle; margin-top:35px;margin-left:10px;display:inline-block;"><img src="images/logo.png"  alt=""  /></a>                                <input type="hidden" name="page" value="1"/>							    <input style="margin-top:50px;" type="text" name="key" value="<%=key %>"  class="span5 ui-autocomplete-input" id="key" placeholder="输入关键词进行查询..."/>                                <input style="margin-top:50px;" type="submit" class="btn btn-primary" value="企业检索" />                                <input style="margin-top: 50px" type="submit" class="btn" value="高级检索" data-toggle="modal"  data-target="#myModal" href="search.jsp"/>		   </form>		  		  <div id="myModal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">		  <form action="GetCategory.action">            				 <div class="modal-header">				  <button class="close" type="button" data-dismiss="modal">&times;</button>					<h3 id="myModalLabel">高级检索</h3>				 </div>				 <div class="modal-body">				 <select name="category" id="bc_id">						<option value="">--选择行业--</option>					</select>					<select name="province" id="lc_id">						<option value="">--选择地区--</option>					</select>					<input type="text" id="key" name="key" class="span5" placeholder="输入关键词进行查询..."/>					<br/>				</div>							 			   </form>	        			   </div>    	

ディスカッションに返信 (解決策)

に問題があるようですz インデックス。
Chrome または Firebug を使用して、ポップアップ ウィンドウの Z-index が 1050 かどうかを確認しますか?ブートストラップ ポップアップ ボックスの例では、クラスはモデル スタイルで、z インデックスは 1050 に設定されています。
黒い背景のクラスは modal-backdrop で、z-index は 1040 です。
両方が OK の場合にのみ、ポップアップ ボックスが正しく表示されます。

前述したように、スタイルの問題は z-index の階層問題によって引き起こされるはずです
ポップアップ ボックスの近くに z-index:100000; のインライン スタイルを追加してみることをお勧めします。