почему мой браузер перезагружается при использовании ajax?

Question

Я создал функцию 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?

Answer 1

Это потому, что вы используете тег <a>, даже если вы не предоставили атрибут href, он перенаправит вас, в вашем случае на домашнюю страницу, поэтому у вас есть эффект перезагрузки. Способ решить эту проблему - создать поддельный тег привязки с помощью тега <span>, который будет иметь стили тега <a>, и прикрепить вашу функцию ajax к тегу <span>