为什么使用ajax时我的浏览器会重新加载?

时间:2020-05-29 10:31:24

标签: javascript ajax

我创建了一个ajax函数,当用户单击它时,它将消息添加到他的“收藏夹”选项卡中。我希望它的工作方式类似于类似Twitter的按钮,因此当用户单击“收藏夹”按钮时,它不会重新加载页面。我正确地创建了所有内容,甚至ajax函数也调用了php文件并将所有内容插入数据库,只是单击后仍然可以重新加载页面。

我的Ajax代码:

 <script>
        function GetXmlHttpObject() { 
      var xmlHttp=null; 
      try 
        { 
        // Firefox, Opera 8.0+, Safari 
        xmlHttp=new XMLHttpRequest(); 
        }
    catch (e) 
        { 
        // Internet Explorer 
        try 
            { xmlHttp=new ActiveXObject("Msxml2.XMLHTTP"); } 
        catch (e) 
            { xmlHttp=new ActiveXObject("Microsoft.XMLHTTP"); }
        } 
    r  eturn xmlHttp; 
   }
      function ajaxfav(){
       var xmlHttp=GetXmlHttpObject();
       var url="favorite.php?message="+document.msgidform.fav_message.value;
      xmlHttp.onreadystatechange=function(){
        if(xmlHttp.readyState==4){
        alert("Message is favorited");

        }
    }
    xmlHttp.open("GET",url,true);
    xmlHttp.send(null);

}
  </script>

我的php代码:

   $user_id = $_SESSION['active_user_id'];
    extract($_POST);
    extract($_GET);
    if(isset($_GET['message']))
    {
        $id=$_GET['message'];

        $q=$db->prepare("SELECT msgid,date,text

        FROM messages 
        WHERE to_id=? and msgid=?");
        $q->bindValue(1,$user_id);
        $q->bindValue(2,$id);
        $q->execute();
        $row2=$q->fetch();
        $d=$row2['date'];


        $fav_questionq=$db->prepare("SELECT *
        FROM messages
        LEFT JOIN users
        ON messages.to_id=users.id
        WHERE users.id=? AND messages.msgid=?

        ");
        $fav_questionq->bindValue(1,$user_id);
        $fav_questionq->bindValue(2,$id);
        $fav_questionq->execute();
        $frow=$fav_questionq->fetch();

        $fquestion= $frow['text'];


        $result = $db->prepare("SELECT * FROM fav_messages
                            WHERE username=? AND message=?");
        $result-bindValue(1,$user_id);  
        $result-bindValue(2,$id);               
        $result->execute();


    if($result->rowCount()== 1 )
    {
        $deletequery=$db->prepare("DELETE FROM fav_messages WHERE message=?");
        $deletequery->bindValue(1,$id);
        $deletequery->execute();
    echo("<script>location.href = 'index.php?a=recieved';</script>");
    }
    else
    {
    $insertquery = $db->prepare("INSERT INTO fav_messages (username,message,fav_question,fav_date) values(?,?,?,?)");
    $insertquery->bindValue(1,$user_id);
    $insertquery->bindValue(2,$id);
    $insertquery->bindValue(3,$fquestion);
    $insertquery->bindValue(4,$d);
    $insertquery-execute();
    }
    echo("<script>location.href = 'index.php?a=recieved';</script>");
    }

我的html代码:

     <form name="msgidform" method="post">
        <input type="hidden" name="fav_message" id="" <?php echo "value= '$msg_id'"; ?>></p>
    </form>



           <a class="msg-icon" href="" onclick="ajaxfav();"><img
            src="images/linedfav.png" id='img'></img></a>

即使我使用的是ajax,为什么浏览器仍会重新加载?

1 个答案:

答案 0 :(得分:1)

这是因为您使用的是<a>标记,即使您没有提供href属性,它也会将您重定向到首页,这就是您具有重新加载效果的原因。解决该问题的一种方法是使用具有<span>标签样式的<a>标签创建伪造的锚标签,并将ajax函数附加到<span>标签