外部で作成された html ファイルから html をインポートしたいと思います。
私は Twitter Bootstrap を使用しており、仕事用のクイズ センターを作成しました。基本的に、各ページには最大 10 の異なるチームが表示され、チーム セクションに最大 50 のクイズを含めることを選択できます。クイズはチームから独立しているため、ページ上で複数使用できます。クイズは、モーダルの iframe を介して開きます - 以下を参照してください。
<h4>General Quizzes</h4>
<ul>
<li>
<p><i class="icon-file"></i>
<a data-toggle="modal" href="#GeneralQuiz">General MF Quiz</a></p>
<div class="modal hide fade myModal_slick" id="GeneralQuiz" tabindex="-1">
<div class="modal-header">
<iframe frameborder="0" height="100%" src="General_quiz.html" scrolling="no"> </iframe> </div>
<div class="modal-footer">
<button class="btn" data-dismiss="modal">Close</button>
</div>
</li>
同じページの別のチーム セクションでクイズまたはモーダルを再利用しているため、いくつかのコードを保存して、外部 HTML ファイルからモーダルをインポートしようとしています。
基本的に、外部のhtmlファイルにコードのこの部分が必要です:
<div class="modal hide fade myModal_slick" id="GeneralQuiz" tabindex="-1">
<div class="modal-header">
<iframe frameborder="0" height="100%" src="General_quiz.html" scrolling="no"> </iframe>
</div>
<div class="modal-footer">
<button class="btn" data-dismiss="modal">Close</button>
</div>
次に、データの切り替えによってのみ呼び出されるようにします。
<a data-toggle="modal" href="#GeneralQuiz">General Quiz</a>
私の仕事ではWeblogicサーバーを使用しているため、PHPはサポートされておらず、Javaのみがサポートされているため、これを簡単にするソリューションが見つからないようです。