称为链接div的Ajax不起作用

时间:2016-10-10 17:19:06

标签: javascript php jquery ajax

我试图通过ajax显示li,但问题是当我点击链接时容器没有弹出。但是,当我试图显示它简单的HTML时,它正在工作。有人可以帮助我找出导致这种情况失败的原因吗?

这是我尝试在简单的html上运行时的输出。它奏效了。

enter image description here

div。

<div id="notificationsss"></div>

ajax脚本

$(document).ready(function() {
  loadnotif();
  $("#notificationLink").click(function() {
    $("#notificationContainer").fadeToggle(300);
    $("#notification_count").fadeOut("slow");
    return false;
  });

  //Document Click hiding the popup 
  $(document).click(function() {
    $("#notificationContainer").hide();
  });
});

function loadnotif() {
  $.ajax({
    url: 'getrecords.php',
    method: 'POST',
    data: {
      "loadnotif": 1
    },
    success: function(data) {
      $('#notificationsss').html(data);
    }
  });
}

getrecords.php

 if(isset($_POST['loadnotif'])){

          $output = '      <ul id="main-menu" class="nav navbar-nav navbar-right">


                   <li class="dropdown hidden-xs">




                    <li id="notification_li">
                    <a href="#" id="notificationLink"><i class="fa fa-globe"></i>     
                        <span class="notification-counter" style="background-color:red;border-radius:3px;padding: 1px 3px;position:relative;top:-9px;right:9px;font: 8px Verdana;;">1</span></a>

                    <div id="notificationContainer">
                    <div id="notificationTitle" style="text-align:center;background-color:#ba4f46;color:#fff;">Notifications</div>
                    <div id="notificationsBody" class="notifications">
                        <a href="index.php" style="display:block;color:black;margin-top:10px;background-color:#f6e9e8;" id="notifa">
                          <div>
                            <img src="img/izuku.jpg" style="max-width:50px;max-height:70px;float:left;margin:0px 10px;">
                             <p style="display:inline;margin-top:20px;"><strong>Rommel Deauna</strong> Uploaded a Lecture on <strong><br>Computer Security</strong></p>
                             <p style="font-size:12px;">November 12, 2016 5:06PM</p>
                                <hr>
                          </div>

                        </a>
                    </div>
                    <div id="notificationFooter" style="background-color:#ba4f46;"><a href="#" style="color:#fff;">See All</a></div>
                    </div>
                    </li>
            </li>


          </ul>';

          echo $output;

   }

0 个答案:

没有答案