</html><script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> <script type="text/javascript"> (function($) { $.fn.ipop = function() { var $this = $(this); var wx, wy; // ウインドウの左上座標 var mx, my; // マウスの座標 // ウインドウの座標を画面中央にする。 wx = $(document).scrollLeft() + ($(window).width() - $(this).outerWidth()) / 2; if (wx < 0) wx = 0; wy = $(document).scrollTop() + ($(window).height() - $(this).outerHeight()) / 2; if (wy < 0) wy = 0; // ポップアップウインドウを表示する。 $this.css('top', wy).css('left', wx).fadeIn(100); // 閉じるボタンを押したとき $this.find('.ipop_close').click(function(){ $this.fadeOut(100);}); // タイトルバーをドラッグしたとき $this.find('.ipop_title').mousedown(function(e) { mx = e.pageX; my = e.pageY; $(document).mousemove(mouseMove).mouseup(mouseUp); return false; }); function mouseMove(e) { wx += e.pageX - mx; wy += e.pageY - my; $this.css('top', wy).css('left', wx); mx = e.pageX; my = e.pageY; return false; } function mouseUp() { $(document).unbind('mousemove', mouseMove).unbind('mouseup', mouseUp); } } })(jQuery); $(function() { $('#open1').click(function() { $("#mado1").ipop(); } ); $('#open2').click(function() { $("#mado2").ipop(); } ); }); </script> <style type="text/css"> .ipop_login { font-family: "Meiryo" !important; padding: 0; background-color: #fed; width: 282px; height: 140px; border: 1px solid #aaa; /* この3行は必須 */ position: absolute; display: none; z-index: 9999; } .ipop_serach { padding: 0; background-color: #fed; width: 320px; height: 400px; border: 1px solid #aaa; /* この3行は必須 */ position: absolute; display: none; z-index: 9999; } .ipop_title { font-family: "Meiryo" !important; font-size:20px; height: 25px; background-color: #fdc; cursor: move; } .ipop_close { cursor: pointer; float: right; }' </style> </head> <body> <input type="button" value="ログイン" id="open1"> <input type="button" value="検 索" id="open2"> <div class="ipop_login" id="mado1"> <div class="ipop_close">×</div> <div class="ipop_title">Login</div> <table border='1'> <tr width="282px"> <td>USER_ID</td><td><input type='text' style="width:170px;"></td> </tr> <tr width="282px"> <td>PASSWORD</td><td><input type='text' style="width:170px;"></td> </tr> </table> </div> <div class="ipop_serach" id="mado2"> <div class="ipop_close">×</div> <div class="ipop_title">検索</div> <?php echo "<form action='./test107.php' method='post'>"; echo"<input type='text' name='keyword' style='width:272px;'><input type='submit' value='検索'>"; echo "<form>"; $keyword = $_POST['keyword']; echo $keyword; ?> </div> </body>
今回は検索ボタンの方での質問でございます。
ログインはスルーしていただけら幸いでございます。
一番最初の検索ボタンをクリックしてダイアログを表示するまでは問題は
ないんですが、ダイアログが開いてキーワードを入れて横にある検索を
押すとダイアログが消えてしまいます。
一番最初のダイアログを検索を再度押してダイアログを開くと最初に入力した
キーワードの文字が表示されており、文字取得表示はできております。
ダイアログに表示されている検索を押してもダイアログが消えることなく
入力したキーワードが表示されているようにさせてたいのですが、どうすれば
できるのか教えて頂けないでしょうか?
予定ではheadにあるjQueryのソースをtest107.jsに保存を考えております。
<script type="text/javascript" src="./test107.js"></script>※test107.jsはまだ作成しておりません。
回答1件
あなたの回答
tips
プレビュー