Question

最后通过One Mad Monkey找到了它，但忘记了我的$ eventDate变量的SQL查询引用。谢谢你们的帮助：）

  $(".date_has_event").live("click",function(){
    console.log('you clicked', this);

    var dateClicked = $(this).attr('id');
    $.ajax({
            type:"GET",
        url: "popup_events.php",
        data:"date="+dateClicked,
        success: function(data){
            $(".popupContent").html(data);
        }});
        //centering with css
        centerPopup();
        //load popup
        loadPopup();

    });

这与我的popup_events.php文件相关联：

<?php

    include ("Includes/dbConnect.php");

    $eventDate = $_GET['date'];

    $query = "SELECT * FROM events WHERE eventDate='$eventDate'";
    $check = mysqli_query($cxn,$query) or die("Couldn't execute query!");

    while($row = mysqli_fetch_array($check))
      {
          $id = $row['eventID'];

          echo "<div class='submit_event_list'><a href='individual_event_page_main.php?id=$id'>";
          echo $row['eventName'];
          echo " | " . $row['host'];
          echo " | " . $row['venue'];
          echo " | " . $row['eventDate'];


          echo "</a></div>";
          echo "<br />";
      }     
?>

Answer 1

如果问题是“这可能吗？”答案是肯定的。当然，您可以将事件绑定到将显示弹出窗口的HTML。人们总是这样做，所以这不是一个有价值的问题！

更广泛的问题是“我是以一种好的方式做到这一点吗？”是一个更难以回答的问题，并且还延伸了“适当的”Stack Overflow问题的限制，这个问题应该比这更加集中。

我说“有它！”安全地知道你可以添加弹出窗口。如果您有更具体的问题，请回来。当你开始时我会想到的事情：

JavaScript是动态生成日历的最佳方式吗？您是否使用服务器端语言？这可能是更好的地方。如果您正在使用JS，为什么不完全构建日历，然后返回并填充它？
你需要让你的ajax调用同步吗？有没有办法可以设计它，以便它可以愉快地获取新信息而不用担心它是否按顺序返回？（提示，这可能与＃1有关）
信息比提示更多：live()是不推荐使用的功能。从jQuery 1.7开始，我将考虑使用.on()。对于使用.live()的{{1}}有一个等价物，但我认为你不应该使用它......你应该使用相当于.on()的等价物，因为你应该有一个日历的祖先可以充当听众（而不是整个文件！）。如果您使用的是jQuery 1.5.x或1.6.x，请使用.delegate()。
也许这应该是第一个问题：你有没有看过已经包含日历和弹出窗口的UI框架（它们不包括事件管理，所以你还有一些有趣的工作要做）？ / p>

Answer 2

我不确定你确实有问题...... 但似乎你可能只需要一些关于如何分辨哪个弹出窗口的帮助。

在你的：

$(".popup").live("click",function(){})

您可以使用特殊的“this”变量来确定点击了哪一天。

例如。

$(".popup").live("click",function(){ 
    console.log('you clicked', this);

    //to get the date id (your formatdate) from this
    var dateClicked = $(this).parent().parent().attr('id');

    //have to do parent() twice because you put your .popup under <div class='title'>
})

为了让它更容易..您应该考虑更改您的点击事件以使用.date_has_event而不是.popup，这样您就可以这样做：

$(".date_has_event").live("click",function(){ 
    var dateClicked = $(this).attr('id');
})

一旦您知道点击了哪一天，您可能想要在弹出窗口中呈现当天的弹出窗口内容（当天的事件列表）。

这就是你应该使用发送到某些后端代码的ajax请求的地方，这些代码基本上就是你已经推到的PHP代码（你的#popupContact下的东西）。你应该把代码移到某个地方......比如说“getEvents.php”

例如

$(".date_has_event").live("click",function(){ 
    var dateClicked = $(this).attr('id');
    $.ajax({
        type: "GET",
        url: "getEvents.php",
        dataType: "json",
        data: "date="+dateClicked,
        success: function(data){
           //fill your popup with the data received

        }   
    })
})

我认为这应该足以让你继续前进。祝你好运。

如何判断要显示哪个JQUERY弹出窗口

2 个答案: