No carga resultado enviado por AJAX

[djboro88]

Hola a todos !!
Estoy intentando hacer un sistema de comentarios por AJAX, pero al hacer el POST, por algún no me muestra el resultado.

Codigo AJAX:

Código Javascript:

/* Enviar form por ajax */
    function enviarComentario(comentario,identrada,idusuario){
        var parametros = {
            "comentario" : comentario,
            "identrada": identrada,
            "idusuario": idusuario
        };
        
        $.ajax({
            data:  parametros, //datos que se envian a traves de ajax
            url:   'blog_guardar_comentario.php', //archivo que recibe la peticion
            type:  'post', //método de envio
            beforeSend: function () {
                    $("#resultado").html("<img src='assets/images/loading.gif' alt='Cargando'>");
            },
            success:  function (response) { //una vez que el archivo recibe el request lo procesa y lo devuelve
                    $("#resultado").html(response);
            }
        });
    }
 

Código HTML:

Código HTML:

<form role="form">
                        <div class="form-group">
                            <textarea class="form-control" id="mensComent" rows="3" style="resize:none;" onpaste="return false" maxlength="1000" onKeyDown="cuenta_caracteres_comentario()" onKeyUp="cuenta_caracteres_comentario()" onkeypress="return escribirTexto(event)"></textarea>
                            
                            <input type="hidden" value="<?php echo $bid; ?>" id="mensidentrada">
                            <input type="hidden" value="<?php echo $_SESSION['idusu']; ?>" id="mensidusuario">
                            
                            <br>
                            
                            <div class="pull-left">
                                <p><i>Ha escrito <span id="conteo_coment">0</span> de 1000 caracteres máximos</i><br>
                                <b>No se permiten etiquetas HTML. Solo texto plano.</b></p>
                            </div>
                            
                            <div class="pull-right">
                                <input type="button" href="" onclick="enviarComentario($('#mensComent').val(), $('#mensidentrada').val(), $('#mensidusuario').val()); return false;" value="Enviar comentario" class="btn btn-success"/>
                            </div>
                            
                            <br>                            
                        </div>
                    </form>
 

Código PHP:

Código PHP:

  <?php //Guardar comentario enviado por AJAX 
include("global/config_blog.php"); 
 
$comentario = $_POST['comentario']; 
$identrada = $_POST['identrada']; 
$idusuario = $_POST['idusuario']; 
$fecha = strtotime("now"); 
 
mysqli_query($conex_blog,"INSERT INTO blog_comentarios (identradas,idusuarios,comentario,fecha)VALUES('$identrada','$idusuario','$comentario','$fecha')"); 
 
echo "<div class='alert alert-success'><i class='fa fa-check-circle'></i> El mensaje ha sido enviado.</div>"; 
 
?>   

Resulta que al enviar el comentario, en vez de salir el mensaje como que se ha enviado correctamente, vuelve a cargar la página.

Os dejo una captura.
Donde marca la flecha roja debería aparecer el mensaje: "El mensaje ha sido enviado."
Pero en cambio vuelve a cargar la página.




¿Qué es lo que falla?