G'Day All、
jQuery $ .post関数を使用して、次のようなパラメーターをPHPファイルに渡そうとしています。
MySQLデータベースからフライト予約情報を収集します。
表示するデータを含むHTMLフォームを生成します。
<div>
HTML出力を非表示に戻します。<div>
ダイアログボックスの一種として、ページの残りのコンテンツの上に表示されるように、を再表示します。
問題は、私が<div id="bookingpop" style="display:none; ... ">
.show()を持っている場合、phpファイルの出力を挿入して表示するように機能するjquery行に.show()が表示(再表示)されないこと<div>
です。(??)
テストとして:
'display:none;'を取り出した場合 常にdivを表示するスタイル(以下のHTMLコードの状態)では、出力は$ .postを介してPHPから要素に入力されますが、明らかに常に存在します(望ましくありません)。
$( "#bookingpop")。hide()は、表示されている場合は非表示にしません(これもテストとして)、
alert(bid);
問題のある行(および)の下にコメントした他のことはalert(output);
、実行が許可されている場合、期待どおりに動作および表示されます。日付ピッカーも問題なく動作します。
#bookingpopの開始タグと終了タグの間にHTML注釈がある場合と
<div>
ない場合で、問題に違いはありません。IE8-9、FF10、Chrome、iPad 3のSafari、他よりも広いフォームフィールド幅を解釈するIE以外の違いはありません。
ヘッダーのJS/jQuery:
<script type="text/javascript">
function passbooking(bid) { // <- bid is the Booking ID
$.post("bookdisplay.php", { bookref: bid },
function(output) {
$("#bookingpop").html(output).show();
// alert(bid);
// alert(output);
});
};
/* Code for th jQuery-ui date picker. */
$(function() {
// $("#bookingpop").hide();
$( "#pick_DATE" ).datepicker({
changeMonth: true,
changeYear: true,
showOtherMonths: true,
selectOtherMonths: true,
dateFormat: "yy-m-d"
});
});
</script>
HTML / PHP:
<div style="position: absolute; top: 0px; left: 0px; height: 124px; width: 157px; border: none; margin: 0;"><img alt="Logo" src="/act/images/avncol-logo.png" />
</div>
<div style="position:absolute; left: 157px; top:0px; width: 1000px; height: 64px; border: none;">
<h2>Aviation College Townsville: Daily Run Sheet</h2>
</div>
<div style="position: absolute; top: 65px; left: 157px; height: 64px; width: 1000px;"><input type="text" id="pick_DATE" size="20" value="<?php echo $date ?>"/></div>
<?php
$booking_overlays = prepevents($date);
// var_dump($booking_overlays);
?>
<div class="parentDiv" style="top: 126px; left: 0px;"> <!-- create a parent div section to contain and reference the timeline <div> elements to -->
<?php
print $timesheet; // Prints a grid/daily planner made from <div> elements
print $booking_overlays; // Prints a event/bookings as time blocks over the planner (as <div>)
?>
</div> <!-- Close the "parentDiv" -->
<!-- This div is the one that pops up over the others to display the booking -->
<div id="bookingpop" style="position: absolute; z-index: 100; background-color:#FFF; left: 200px; top: 50px; width: 610px; height: 500px; border: 3px solid; margin: 0;"><!-- the data goes in here --></div>
</body>
</html>
私はJS/jQueryを初めて使用し、HTMLを再学習しています(CSSが存在し、JSが一般的である前からHTMLに触れていません)。誰かが場違いなもの(または単に間違っているもの)を見ることができる場合は、私に知らせてください。