Question

G'Day All，

我正在尝试使用jQuery $ .post函数将一些参数传递给PHP文件：

从MySQL数据库收集航班预订信息
生成一个包含显示数据的HTML表单，
将HTML输出返回到隐藏的<div>，
取消隐藏<div>，使其位于页面其他内容的顶部，作为一种对话框。

问题是，如果我有<div id="bookingpop" style="display:none; ... ">，jquery行中的.show（）用于插入和显示php文件的输出，不显示（取消隐藏）<div> 。（??）

作为测试：

如果我拿出'display：none;'样式总是显示div（就像下面HTML代码的状态一样），输出通过$ .post从PHP填充元素工作正常，但显然总是存在（不需要的）。
$（“＃bookingpop”）。hide（）如果可见则不会隐藏它（再次，作为测试），
我在侵权行（alert(bid);和alert(output);下面注册的其他内容如果允许运行，则会按预期行事并显示。
日期选择器也可以正常工作。
在#bookingpop <div>的开放和结束标记之间是否有HTML备注对此问题没有任何影响，
iPad 3上的IE8-9，FF10，Chrome，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很常见）。如果有人可以看到任何不合适的地方（或者只是错误的话），请告诉我。

Answer 1

jQuery的html（）方法的输出是一个字符串 - 而不是关联的jQuery元素。所以，你在字符串上调用show（）。试试这个：

$("#bookingpop").show().html(output);

你也可以分开两行：

$("#bookingpop").html(output);
$("#bookingpop").show();

$ .post（）。html（）。显示没有'显示'<div> </div>

1 个答案: