tengo el siguiente fragmento de HTML que crea una nueva ventana cuando se hace clic:W3C validado vínculo de anclaje con target = "_ blank"
<a href="/path/to/site" target="_blank">glide by the people</a>
problema es que no pasa el validador del W3C. ¿Cómo creo un enlace como el anterior que valide?
Utilice este tipo de documento:
<!DOCTYPE html PUBLIC "-//w3c//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhmtl1/DTD/xhmtl1-transitional.dtd">
1,0 de transición tiene capacidad para un cierto código HTML "legado", incluyendo target = "_ blank".
¿Hay algún forma de obtener la misma funcionalidad sin recurrir al tipo de documento de transición? – Nate
No sin usar javascript. (ver la publicación de @ajm a continuación) La razón por la que se eliminó esto se debió a la accesibilidad y la interacción del usuario. Los usuarios quieren control sobre eso, no popups. :) – ghoppe
Suponiendo XHTML estricto, vinculará un evento onclick al delimitador en cuestión. Algo así como:
<a href="/path/to/my/link" onclick="window.open('/path/to/my/link');return false;">My link</a>
Uno también podría argumentar que debe ser vinculante para que la acción onclick por separado con JavaScript externa debido a la mejora progresiva y separar el comportamiento de su margen de beneficio, pero esa es la forma básica de hacerlo.
Problema menor: DRY! reemplace la URL en el controlador de eventos onclick con 'this.href'. Además, mueva todo eso a un archivo JavaScript en lugar de saturar su HTML. –
No se puede hacer con la validación estricta del W3C.
Las soluciones son:
tipo de documento de Transición como ya se mencionó
Un validador diferente (por ejemplo CSE)
Uso de JavaScript para sustituir "_blank" - ver http://www.ajaxblender.com/open-links-new-window-w3c-valid-target-blank.html (el enlace muestra cómo hacerlo realmente bien con jQuery - Estoy pegando los 2 ejemplos a continuación).
$(document).ready(function(){
$('A[rel="_blank"]').each(function() {
$(this).attr('target', '_blank');
});
});
// ...OR...
$(document).ready(function(){
$('A[rel="_blank"]').click(function() {
window.open($(this).attr('href'));
return false;
});
});
1.) No debería t use los nombres de marcado como mayúsculas. Use minúsculas en su lugar. 2.) Hay un error sintáctico en este código: hay un signo "mayor que" antes de "falso". 3.) Yo Debería indicar claramente que se trata de 2 soluciones separadas en el código jQuery. – Sk8erPeter
@ Sk8erPeter: ¿cuál es el motivo del número 1? – DVK
por supuesto, ambos funcionan en jQuery, ya que maneja las etiquetas de una manera que no distingue entre mayúsculas y minúsculas. Es más bien una convención de nombres; para compatibilidad con XHTML, debería usar también etiquetas en minúsculas en formato HTML, ya que los documentos XHTML [solo pueden usar etiquetas en minúscula] (http://www.w3.org/TR/xhtml1/diffs.html#h-4.2) . Así que debes apegarte a estas convenciones en tus códigos JavaScript también. :) [Aquí hay algunos aspectos interesantes] (http://wiki.answers.com/Q/Should_you_use_upper_case_or_lower_case_HTML_tags), y [aquí hay otro] (http://www.websiteoptimization.com/speed/tweak/lowercase/). – Sk8erPeter
La validación no es el principio y el fin de la calidad de codificación.
Algunas cosas son "estándar" en los navegadores sin ser un estándar w3c.
Usar un poco de JS es un poco exagerado cuando la función ya existe.
¿Qué pasa si la validación W3C es un requisito estándar de codificación? – Aye
De hecho. La validación es una gran herramienta, pero no es como W3C son dioses que hacen todo bien. Los estándares no son perfectos – PatrikAkerstrand
@Lemurik: cada navegador entiende y acepta target = "_ blank". El hecho de que no esté en el estándar W3C no lo hace incorrecto. – PatrikAkerstrand
Si es sólo uno o dos enlaces, puede hacerlo en línea con
<a href="http://stackoverflow.com" onclick="window.open(this.href); return false;"></a>
Más que eso, y es probable que desee una de las soluciones anteriores js.
Me gusta este. ¡Gracias! – Chris
Creo que estás haciendo la pregunta incorrecta. El atributo de destino no es válido en XHTML 1.0 estricto, independientemente de si lo inserta con JavaScript o simplemente lo tiene en la respuesta del servidor.
Si realmente quieres ese atributo, tienes que usar un doctype diferente, pero esa tampoco es la respuesta correcta.
Usted debe preguntarse por qué quiere el atributo. Supongo que estás intentando crear una nueva pestaña o ventana. Huelga decir que esto generalmente se considera un mal diseño (le quita el control al usuario), pero si realmente quieres hacerlo, puedes hacerlo con JavaScript.
Así es como:
Mantenga sus enlaces, pero añadir una clase especial, por ejemplo, "emergente" para ellos. A continuación, añadir una línea de código JavaScript (preferiblemente usando un marco como jQuery o Prototype para que sea más fácil) que se lleva todos los vínculos con esa clase y les da un controlador on-clic que resulta en la creación de una nueva pestaña/ventana y cancela el valor por defecto acción (es decir, evita que el enlace funcione como un enlace). Sin embargo, eso todavía molestará a la gente ya que anula el comportamiento esperado.
Lo que no debe hacer es reemplazar los enlaces con enlaces ficticios y confiar en JavaScript para que los enlaces funcionen.
caso omiso de eso. El atributo target ya no está en desuso en HTML (el nivel de vida o "5", dependiendo de si sigues WHAT WG o W3C). hoy la respuesta correcta es simplemente reemplazar su DOCTYPE con esto:
<!doctype html>
nota que ya no tiene que estar en mayúsculas, ni realmente se ven como una declaración DOCTYPE completa SGML. Es solo un artefacto vestigial que identifica el documento como HTML conforme a los estándares.
No tengo muchos enlaces externos, solo uno de hecho. Mi documento fue completamente validado aceptar para la nueva parte de la ventana. He visto muchas solluciones aquí. gracias por su respuesta – Chris
rel="new-window" atributo para el enlace (en lugar de target="_blank") script de jQueryañadir a la cabeza de la página y añadir el siguiente fragmento
<script type="text/javascript">
$(document).ready(function(){
$('a[rel="new-window"]').click(function(){
window.open(this.href);
})
});
</script>
(Tenga en cuenta que a medida que he escrito esto en el cuadro de texto stackoverflow, no lo he probado.)
En realidad, las soluciones propuestas aquí con anuncios ¡ding el atributo "objetivo" a través de JavaScript cumple completamente con los estándares!
La cuestión es que, de acuerdo con la especificación W3C DOM Nivel 1, la interfaz HTMLLinkElement DO tiene un atributo de destino, aunque el elemento A de la especificación HTML 4.01 no lo tiene.
Por lo tanto, no es válido escribir el atributo "objetivo" en el archivo html, pero es válido para agregarlo al árbol de documentos más tarde a través de interfaces DOM que usan JS.
Si tiene un requisito de accesibilidad o interoperabilidad multiplataforma, es probable que desee validar su página web. Hay un bonito documento que responde la pregunta sobre "¿por qué validar?" publicado por W3.org http://validator.w3.org/docs/why.html
En mi humilde opinión, muestra que se preocupa por su público, cuando se toma el tiempo adicional para validar. Luego, tendrá páginas que muestran prácticamente lo mismo en IE, Opera, Safari y Firefox.
<a href="..." onclick="return !window.open(this.href)">...</a>
En lugar de utilizar:
target = "_ blank"
uso:
onclick = "this.target = '_ blank'"
N ota las comillas simples dentro de las comillas dobles. Esto resolvió el problema de validación para mí, sin tener que redefinir el tipo de documento.
Tal vez sea obvio para otras personas, pero esta pregunta no tiene sentido para mí. ¿Puedes elaborar un poco? –
@ Adam: cree una página HTML simple con un elemento de enlace que tenga el atributo "target =" _ blank ". Intente validarlo contra el validador W3C. Obtendrá un error (IIRC porque el atributo target está en desuso) – DVK