La mejor manera de implementar un sistema de navegación web 2.0

StackOverflow https://stackoverflow.com/questions/3251263

Pregunta

Ahora aquí está mi situación: estoy haciendo un CMS.Cuando se hacen clic en los enlaces, me gustaría que las páginas carguen dinámicamente usando AJAX.El problema en los enlaces!

La única forma de cambiar la dirección en la barra de direcciones en tiempo real es usar las etiquetas de anclaje.Pero PHP no obtiene las etiquetas de anclaje, por lo que no puedo cargar contenido de la página en la carga del sitio usando PHP. Y si tuviera que cargar las páginas usando una cadena de consulta, la cadena de consulta no se pudo actualizar en la barra de direcciones en el clic de un enlace, ya que eso volvería a cargar la página.

Supongo que Javascript podría verificar la dirección, guardar la etiqueta de anclaje en una cookie y volver a cargar la página, pero preferiría no tener que ir a tales longitudes.

¿Alguien sabe una solución a este problema?

¿Fue útil?

Solución

Hubo una pregunta similar no hace mucho, y me fui con la siguiente solución.

Sus URL deben apuntar a las páginas reales para poder trabajar para los usuarios de JS discapacitados.Los manipuladores de clic deben manejar las solicitudes de AJAX.Hash debe contener la URL, y una parte como &ajax para indicar el tipo de solicitud.

Si la solicitud es de AJAX simplemente envíe el contenido.Si no lo es, envuelva el contenido en el encabezado y el pie de página para responder con un sitio completo.

Las URL deben funcionar con la conexión a los hashes generados por AJAX y usarlos como enlaces.Toda la idea es básicamente imita el tipo de comportamiento que puedes ver en Facebook.

javascript 

// click handler for ajax links
function goToWithAjax(hash) {
  hash = hash.href ? hash.getAttribute("href", 2) : hash;
  ajax( hash, function( response ) {
    document.getElementById("content").innerHTML = response;
  });
  hash = ("#!/" + hash).replace("//","/");
  window.location.hash = hash;
  return false;
}

.htaccess 

auto_prepend_file = "prepend.php"  
auto_append_file  = "append.php"

prependa 

$url   = $_SERVER['REQUEST_URI'];
$parts = explode('#!', $url);
$hash  = isset($parts[1]) ? $parts[1] : false;

// redirect if there is a hash part
if ($hash) {
  header("Location: $hash");
}

// find out if it's an ajax request
$ajax = strstr($url, "&ajax");

// we need header if it's not ajax
if (!$ajax) {
  get_header();
}

agregar 

// we need footer if it's not ajax
if (!$ajax) {
  get_footer();
}

get_header () 

function get_header() {

echo <<< END
<html>
<head></head>
<body>
<div id="page">
  <div id="header">
    <div id="logo"></div>
    <ul id="nav">menu...</ul>
  </div>
  <div id="content">
END;

}

get_footer () 

function get_footer() {

echo <<< END
  </div> <!-- end of #content --->
  <div id="footer">(c) me</footer>
</div> <!-- end of #page --->
</body>
</html>
END;

}

Otros consejos

I can see why you might want to load parts of the page with ajax. A whole page is rather pointless though.

A jQuery solution might be something like:

$(a.ajax_link).click(function(){
  var url = $(this).attr('href');
  $.ajax({
    url:url,
    success:function(data) {
      $('body').html(data);
      return false;
    }
  });
});

I have in no way tested that, but it should still work without javascript enabled.

Licenciado bajo: CC-BY-SA con atribución
No afiliado a StackOverflow
scroll top