无法让 Jquery 代码在点击时工作答案

【问题标题】：Can't get Jquery code to work on click无法让 Jquery 代码在点击时工作
【发布时间】：2017-01-10 20:12:28
【问题描述】：

我有一个日历，它从在线 API 中提取日期和时间。当它拉时间时，它会在<ul> 和<li> 设置中显示它们，如下所示：

这是用于解析时间和创建列表项的 PHP 代码：

foreach($decoded as $times){    
    $dateTime = DateTime::createFromFormat('Y-m-d\TH:i:sO', $times->time);
    $time = $dateTime->format('h:i A');

     $eventListHTML .= '<li id='.$times->time.' class="available_times">'.$time.'</li><br>';
}

我也有 Jquery，当单击列表项之一时，向上滑动包含日历的 div，然后通过向下滑动显示下一个 div。这是代码：

   $(".acuity_times").click(function(){

    $("#calendar_div").slideUp(1000,function(){
       $("#marketing_div").slideDown(1000);
    });
});

以下是 Jquery 中引用的两个 div：

<div id="calendar_div">
<script>
$("#calendar_div").hide(0);
</script>
    <?php echo getCalender(); ?>
</div>
<div id="marketing_div">
<script>
$("#marketing_div").hide(0);
</script>
    <?php echo chooseMarketing(); ?>
</div>

我最终希望它做的是，当我单击日历上的可用时间时，它将花费在 PHP 的 ID 中设置的时间并将其保存以供以后安排约会，但我没有尚未实现该部分，我只是想让滑动动作起作用。目前，当我单击列表项时，它什么也不做。

【问题讨论】：

你真的是这样交错你的jQuery代码吗？
也许使用style="display:none;" 来隐藏垃圾，而不是在 tarnation 中使用 jquery
感谢您的建议。我确实尝试过 style="display:none;"之前它没有工作，但现在它出于某种原因，可能只是被缓存或什么的。但这仍然不能解决我原来的问题。
不确定这是否是复制/粘贴错误，但是，您丢失了：});在您的 jQuery 中...修复后，代码可以正常工作：jsfiddle.net/kxqtL0nu P.S. slideUp没有太多意义，div已经隐藏了？
试试$(document).on('click', '.available_times', function(){ $("#calendar_div").slideUp(1000,function(){ $("#marketing_div").slideDown(1000); }); });

标签： php jquery html

【解决方案1】：

更新你的 PHP 并添加一个花费时间的 value 属性：

foreach($decoded as $times){    
    $dateTime = DateTime::createFromFormat('Y-m-d\TH:i:sO', $times->time);
    $time = $dateTime->format('h:i A');

    $eventListHTML .= '<li id='.$times->time.' value='.$times->time.'  class="available_times">'.$time.'</li><br>';
}

更新您的 jQuery 代码以在 li 元素上绑定点击事件：

$(".available_times").on('click', function() {
    var time = $(this).val();
    $("#calendar_div").slideUp(1000, function() {
        $("#marketing_div").slideDown(1000);
    });
});

【讨论】：