hola que tal necesito saber si alguien me puede ayudar a solucionar un problema, que ya tengo varios dias quebrandome la cabeza con los contenidos de los tab:
Tengo los siguientes tabs: Datos generales, Datos de empleos, Otros datos,
En los cuales en cada uno de ellos manejo cajas de texto, radio buttons, checkbox y <a>
Cuando hago una quiero escribir en una caja de texto de datos generales no me deja escribir nada,
y luego cuando cambio de tab a datos de empleos quiero seleccionar un radio y no me deja , a su vez ese radio tiene una funcion de javascrip que me trae otros elementos..
Espero me puedan ayudar :(
Este es el código
<div id="divContenedor" name="divContenedor">
<!--Pestaña 1 activa por defecto-->
<input id="tab-1" type="radio" name="tab-group" checked="checked"/>
<label for="tab-1"> Datos formales</label>
<!--Pestaña 2 inactiva por defecto-->
<input id="tab-2" type="radio" name="tab-group" />
<label for="tab-2"> Datos informales</label>
<!--Pestaña 3 inactiva por defecto-->
<input id="tab-3" type="radio" name="tab-group" />
<label for="tab-3">Otros datos,</label>
<div id="divDatosFormales">
<table>
<tr>
<td>Nombre especie<input type="text" name="nombreEspecie" id="nombreEspecie"></input>
</td>
</tr>
<tr>
<td>
</td>
</tr>
<tr>
<td>Autor autoridad: <a id="activarBusqueda" name="activarBusqueda" onClick="ActivarAutorAutoridad()"><i class="fa fa-search fa-2x" aria-hidden="true"></i>Buscar
</a> <a id="activarNuevoAutorAutoridad" name="activarNuevoAutorAutoridad" onClick="ActivarNuevoAutorAutoridad()"><i class="fa fa-file-text-o fa-2x" aria-hidden="true"></i>
Nuevo</a>
</td>
</tr>
<tr>
<td>
<div id="divConsultarAutorAutoridad" name="divConsultarAutorAutoridad">
</div>
</td>
</tr>
<tr>
<td>
Tipo cita:
</td>
</tr>
<tr>
<td>Libro o publicacion unica
<INPUT type='radio' name="cita" id="cita" value="libro" onclick="EtiquetasAltaCitaLibroPublicacionUnica(th is)"/>
<div id="divEtiquetasAltaCitaLibro" name="divEtiquetasAltaCitaLibro">
</div>
</td>
</tr>
<tr>
<td>Revista
<INPUT type='radio' name="cita" id="cita" value="revista" onclick='EtiquetasAltaCitaRevistaPublicacionPeriod ica(this)'/>
<div id="divEtiquetasAltaCitaRevista" name="divEtiquetasAltaCitaRevista">
</div>
</td>
</tr>
</table>
</div>
<div id="divDatosInformales">
<table id="tBasonimo" name="tBasonimo">
<tr>
<td>Nombre basonimo
<input type="text" name="nombreBasonimo" id="nombreBasonimo"></input>
</td>
</tr>
<tr>
<td>Autor autoridad: <a id="activarBusqueda" name="activarBusqueda" onClick="ActivarAutorAutoridadBasonimo()"><i class="fa fa-search fa-2x" aria-hidden="true"></i>Buscar
</a>
<a id="activarNuevoAutorAutoridadBasonimo" name="activarNuevoAutorAutoridadBasonimo" onClick="ActivarNuevoAutorAutoridadBasonimo()"><i class="fa fa-file-text-o fa-2x" aria-hidden="true"></i>
Nuevo</a>
</td>
</tr>
<tr>
<td>
<div id="divConsultarAutorAutoridadBasonimo" name="divConsultarAutorAutoridadBasonimo">
</div>
</td>
</tr>
<tr>
<td>
Tipo cita:
</td>
</tr>
<tr>
<td>Libro o publicación unica
<INPUT type='checkbox' name="citaBasonimo" id="citaBasonimo" value="libro" onclick="EtiquetasAltaCitaLibroPublicacionUnicaBas onimo(this)"/>
</td>
</tr>
<tr>
<td>Revista
<INPUT type='checkbox' name="citaBasonimo" id="citaBasonimo" value="revista" onclick='EtiquetasAltaCitaRevistaPublicacionPeriod icaBasonimo(this)'/>
</td>
</tr>
</table>
</div>
<div id="divOtrosDatos">
<p>agregar contenido</p>
</div>
</div>
lo que hace que funcione las tabs
#divContenedor #divDatosFormales,#divContenedor #divDatosInformales,
#divContenedor #divOtrosDatosspecie,
#divEtiquetasAltaEspecie #usosNombreComun{
opacity: 0;
padding: 1.5em;
position: absolute;
z-index: -100;
}
#datosEspecie tr {
clear: both;
margin-bottom: 1em;
}
#datosEspecie #divDatosEspecie1 {
float: left;
margin-right: 1em;
}
#datosEspecie #divDatosEspecie2{
float:right;
margin-right: 1em;
}
/*#basonimo tr {
float: left;
width: 48.5%;
}*/
#divBasonimo1 {
float: left;
margin-right: 1em;
}
#divBasonimo2{
float:right;
margin-right: 1em;
}
#sinonimos tr {
margin-bottom: 1em;
}
#sinonimos ul {
margin-left: 2em;
}
#informacionEspecie tr {
clear: both;
margin-bottom: 1em;
}
#informacionEspecie p.left img {
float: left;
margin-right: 1em;
}
#informacionEspecie p.last {
margin-bottom: 0;
}
#usosNombreComun tr {
clear: both;
margin-bottom: 1em;
}
#usosNombreComun p.left img {
float: left;
margin-right: 1em;
}
#usosNombreComun p.last {
margin-bottom: 0;
}
#divContenedorEtiquetasEspecie input#tab-1:checked ~ #divEtiquetasAltaEspecie #datosEspecie,
#divContenedorEtiquetasEspecie input#tab-2:checked ~ #divEtiquetasAltaEspecie #basonimo,
#divContenedorEtiquetasEspecie input#tab-3:checked ~ #divEtiquetasAltaEspecie #sinonimos,
#divContenedorEtiquetasEspecie input#tab-4:checked ~ #divEtiquetasAltaEspecie #informacionEspecie,
#divContenedorEtiquetasEspecie input#tab-5:checked ~ #divEtiquetasAltaEspecie #usosNombreComun{
opacity: 1;
z-index: 100%;
}