首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >用jQuery修改PHP生成的HTML

用jQuery修改PHP生成的HTML
EN

Stack Overflow用户
提问于 2018-08-10 05:22:30
回答 1查看 57关注 0票数 -1

随着时间的推移,我在自己的项目中使用了一些日历小部件,但最近我认为它们不符合我的期望。所以我最近决定构建我自己的“日历小部件”。

我有这两个文件(为了演示而简化):

index.php

代码语言:javascript
复制
<div id="displayCalendar"></div>
<div id="displayStaff"></div>

<script>
  function selectDay(selected) {
    if(selected != $('#date').val()){
      var day = "#" + selected;
      $('.calendar-day-active').removeClass("calendar-day-active");
      $(day).addClass("calendar-day-active");

      $('#date').val(selected);

      getInfo();
    }
  }

  function displayCalendar(attrib = ""){
    $.ajax({
      type: 'POST',
      url: 'loadCalendar.php',
      data: { attrib: attrib },
      success: function(response) {
        $('#calendar_display').html(response);
      }
    });
  }
</script>

loadCalendar.php

代码语言:javascript
复制
<?php
  // this will be displayed for each day in the selected month
  echo '<div class="col border border-success calendar-day" id="calendar '.$day.$month.$year.'" onClick="selectDay(`'.$day.$month.$year.'`);">';
?>

现在的问题是,当我单击日历的某一天时,类calendar-day-active会从旧元素中删除,但单击的那个元素不会添加这个类。

我还尝试过通过Chromes Dev工具选择和更改元素,但没有成功。

有没有办法修改用php和ajax生成的html?(因为php文件是通过ajax加载的)

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2018-08-10 05:37:50

如果您希望id字段中包含空格,则应使用不同类型的选择器:

代码语言:javascript
复制
function selectDay(selected) {
 if(selected != $('#date').val()){
   var day = selected;
   $('.calendar-day-active').removeClass("calendar-day-active");
   $("div[id='calendar " + day + "']").addClass("calendar-day-active");

   $('#date').val(selected);

   getInfo();
 }
}

或者,你可以用下划线代替空格,这样就很好了。

票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/51775959

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档