Hasta HTML 4.01 el atributo id es muy restringido en cuanto a los personajes valor permitido (reglas de nomenclatura):
atributo id debe comenzar con una letra AZ o az, seguido de: cartas (A-Za-z), dígitos (0-9), guiones ("-"), guiones bajos ("_"), dos puntos (":") y puntos (".") Y todos los valores son distingue entre mayúsculas y minúsculas.
* Nota: en mi experiencia he encontrado utilizando únicamente caracteres en minúsculas y _ para identificadores les hace muy claro y se destacan de los selectores CSS (.something: pseudo-clase) *
Por otra parte en HTML5 puede tener casi cualquier cosa como valor de identificación.
Ref: http://www.w3.org/TR/html5/elements.html#the-id-attribute
Así que su selector está perfectamente bien (válida) con especificaciones de HTML5, pero con el fin de conseguir que funcione con jQuery tiene que escapar todos los caracteres que el analizador selector utiliza con un significado especial. Y debido a su código JavaScript, debe usar dos \\ (el primero escapa al segundo). JQuery no le ofrece una manera de hacer esto, es abajo es el código que estoy utilizando:
Ejemplo:
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>jQuery HTML5 Selector Escaping</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript">
// Ths is the list of special characters used by jquery selector parser
// !"#$%&'()*+,./:;[email protected][\]^`{|}~
$(document).ready(function() {
var selector = '{my_%real{ly:s#tra`n[ge_i]d_n^@a|me>}';
selector = selector.replace(/([ {}\|`\^@\?%#;&,.+*~\':"!^$[\]()=>|\/])/g,'\\$1');
var object = $('#'+selector+' ul').children().size();
alert('UL has '+ object +' LIs');
});
</script>
</head>
<body>
<div id="{my_%real{ly:s#tra`n[ge_i]d_n^@a|me>}">
<ul>
<li>Sehr</li>
<li>Gut</li>
<li>Doh</li>
</ul>
</div>
</body>
</html>
he editado el código, algunos errores en caso de fijación. :)
¿La identificación del elemento es realmente '{segment_3}'? Las llaves hacen que no sea válido. – lonesomeday
¿Tu section_id var no contiene realmente llaves cuando estás usando esto? Eso causaría un problema. – CalebHC
la variable {segment_3} es previamente analizada por el framework (code_igniter) antes de que se ejecute javascript, por lo que en realidad es solo una cadena. Descubrí que realmente funciona para hacer esto: var num_children = $ ('# {segment_3} ul'). Pero aun así, asumiendo que solo estaba diciendo algo como: var section_id = 'section_1', ¿sería válido el código anterior? ¿Puedes construir un selector así? – mheavers