Marcar checkbox desde otra etiqueta

[metacortex]

Tengo este javascript:

Código php:

<script type = "text/javascript">
    function marcar_checkbox() {
    var marca = document.getElementById("mostrar-rss");
    if (marca.checked == true) marca.checked = false;
    else marca.checked = true;
}
</script>
 

Y el HTML es éste:

Código html:

<p class="descripcion" onclick="marcar_checkbox()"><input type="checkbox" id="mostrar-rss" name="mostrar-rss" value="1"  /> Mostrar miniaturas en avances RSS</p>
 

Funciona perfecto. Al hacer clic en el texto se activa/desactiva el checkbox. El problema es que hay varios checkbox y quisiera tomar la etiqueta por clase en lugar de ID, de manera que funcione para todos los checkbox que tengan esa clase. Tengo un rato intentándolo y no doy con la solución ¿cómo le hago?.

[emiliodeg]

el tema es q tenes q usar getElementsByName()

[metacortex]

Gracias emiliodeg. Lo que pasa es que en este caso el atributo Name también es único al input. Mediante clases sería genial porque se permite colocar una sola común a todos.

[foreverOdd]

Hola

que tal asi:

Código javascript:

function marcar(elemento){
 
pregunto si tiene la clase
    clases = elemento.className; //tomo las clases del parrafo actual
    aClases = clases.split(" ");
    for(j=0;j<aClases.lenght;j++){
    if (aClases[j]=="descripcion"){ //si el parrafo tiene la clase descripcion
         (elemento.childNodes[0].checked) ? elemento.childNodes[0].checked = false: elemento.childNodes[0].checked = true;
      }
}
}
 
 
onclick="marcar(this)"
 

no lo he probado, lo he escrito a la carrera ojala y te ayude

[foreverOdd]

Ahora si, probado y todo ajajaja

Código javascript:

window.onload = function(){
parrafos = document.getElementsByTagName("p"); //todos los parrafos
for(i=0;i<parrafos.length;i++){
    clases = parrafos[i].className; //tomo las clases del parrafo actual
    aClases = clases.split(" "); //las clases del parrafo actual
    for(j=0;j<aClases.length;j++){
            if (aClases[j]=="descripcion"){ //si el parrafo tiene la clase descripcion
           parrafos[i].onclick = function(){ //el evento click para el parrafo
                       //asumiendo que el parrafo solo tiene un hijo o que el primero es el checkbox
            (this.childNodes[0].checked) ? 
            this.childNodes[0].checked = false: this.childNodes[0].checked = true;
 
        }
      }
 
}
 
}
}
 
 
</script>
 

suerte!

[foreverOdd]

me di cuenta de un error

Código javascript:

<script>
window.onload = function(){
 
 
parrafos = document.getElementsByTagName("p");
 
for(i=0;i<parrafos.length;i++){
 
 
 
    clases = parrafos[i].className; //tomo las clases del parrafo actual
    aClases = clases.split(" ");
    
    for(j=0;j<aClases.length;j++){
 
            if (aClases[j]=="descripcion"){ //si el parrafo tiene la clase descripcion
           parrafos[i].onclick = function(e){
            if(this == e.target)
            (this.childNodes[0].checked) ? 
            this.childNodes[0].checked = false: this.childNodes[0].checked = true;
            
        }
      }
 
}
 
}
}
</script>
 

[zerokilled]

hay navegadores que incluyen una funcion no estandar parecido a getElementsByTagName pero para obtener los elementos por clases, getElementsByClassName. para compensar los navegadores que no tienen dicha funcion puedes crear tu propia version. de esta manera puedes obtener los elementos independientemente del tipo de elemento: P, DIV, INPUT, etc. a continuacion el codigo para los navegadores que no tienen dicha funcion. por supuesto, tienes que primero cargar el codigo antes de cualquier otro para evitar problemas:

Código:

if(!document.getElementsByClassName){
document.getElementsByClassName = function(className){
var regex = new RegExp(className);
var array = [];
var element = arguments[1] || document.documentElement;
	for(var elem = element.firstChild; elem != null; elem = elem.nextSibling){
	if(elem.nodeType != 1)continue;
	if(regex.test(elem.className)) array.push(elem);
	if(elem.hasChildNodes()) array = array.concat(arguments.callee(className, elem));
	}
return array;
}}

esta funcion es parecida pero no exactamente igual a document.getElementsByClassName. difiere en que en lugar de devolver una coleccion de elementos devuelve un array. tienes que tener muy en cuenta ese detalle porque hay ciertas cosas que no se pueden lograr. por ejemplo, un cambio en el documento, como remover los elementos del documento, altera la coleccion de elementos pero en un array no se puede apreciar dicha alteracion. sencillamente porque un array no es lo mismo que una coleccion.

[metacortex]

Muchachos, mil gracias por su ayuda y por favor disculpen la tardanza en responder.

foreverOdd, gracias por el script el cual estoy aplicando en este momento a un caso. Te cuento que al final solucioné el asunto del clic con HTML a través de la etiqueta <label>. Al principio no la había aplicado por 2 razones: pensaba que iba a alterar la presentación y no sabía que podía anidarse entre otras etiquetas con plena libertad .

El caso es que paralelamente surgió un asunto que sí necesita del javascript. Recién estoy retomando todo el proyecto luego de un tiempo en "off" por de trabajo, pero lo importante es que esto avance antes de que comience a ponerse cansón .

zerokilled, gracias por esa buena aclaratoria. Al principio pensaba (ilusamente) que getElementByClass (o ClassName) podía agregarse igual de fácil que ByID, pero al buscar un poco me estrellé contra una pared. Hubiese sido genial hacer un simple reemplazo, pero tal como mencionas la diferencia radica en que las clases requieren ser leidas como un array (o al menos eso es lo que hasta ahora entiendo).

Saludos.

[zerokilled]

Hubiese sido genial hacer un simple reemplazo, pero tal como mencionas la diferencia radica en que las clases requieren ser leidas como un array (o al menos eso es lo que hasta ahora entiendo).

en lo unico que se asemeja un array y una coleccion es que ambos tienen formas de indices para referirse a sus elementos. sin embargo, no necesariamente comparten las mismas funciones o propiedades. a continuacion un ejemplo de lo que podrias hacer.

Código:

function marcar_checkbox() {
var marca = document.getElementsByClassName("mostrar-rss"); // asumiendo mostrar-rss es la clase;
for(var i = 0; i < marca.length; i++){
marca[i].checked = !marca[i].checked;
}
}