display

akp · 1 Ott 2015

buonasera,ho un problema con css, praticamente io ho una classe con un contenuto nascosto (display : none) e voglio che al click di un bottone questo contenuto venga mostrato,quindi nel javascript ho questo ocodice :
$("#id").click(function(event){
$(".classe").show();
});
il problema è che la classe non si visualizza rimane nascosta.
Qualcuno ha avuto questo problema?come potrei risolvere?

borgo italia · 1 Ott 2015

ciao
mi sembra più un problema di js/jquery
ti sposto nella sezione

MikiProgrammer · 1 Ott 2015

Scusa, ma basta che scrivi:

Codice:

document.getElementById('nome_elemento').style.display = 'none';

akp · 2 Ott 2015

MikiProgrammer ha scritto:
Scusa, ma basta che scrivi:

Codice:

document.getElementById('nome_elemento').style.display = 'none';

ho provato e non funziona.

MikiProgrammer · 2 Ott 2015

Scusami. Al posto di getElemtById devi mettere getElementByClass

akp · 2 Ott 2015

MikiProgrammer ha scritto:
Scusami. Al posto di getElemtById devi mettere getElementByClass

il comando corretto è :

Codice:

document.getElementsByClassName('classei').style.display = 'block';

comunque non funziona

MikiProgrammer · 2 Ott 2015

Prova così:

Codice:

function mostraClasse(){
document.getElementByClassName('classe').style.display = 'block';
}

HTML:

<a href="#" onclick="javascript:mostraClasse()"><br><div class="classe">Prova classe</div>

marino51 · 3 Ott 2015

l' esempio sottostante funziona benissimo, adattalo alla tua necessità
ciao
Marino

HTML:

<script>
function script2() {
    var e = document.getElementById("pippo");
    if (e.style.visibility == 'hidden') {
        e.style.visibility = 'visible';
        e.style.display = 'block';
    } else {
        e.style.visibility = 'hidden';
        e.style.display = 'none';
    }
}
</script>
<div id="pippo">
Io scompaio e appaio!
<img src="input_type.png" width="220" eight="69" />
</div>
<input type="button" value="Clicca per far sparire/ricomparire" onClick="script2()" />

akp · 3 Ott 2015

marino51 ha scritto:

l' esempio sottostante funziona benissimo, adattalo alla tua necessità
ciao
Marino

HTML:

<script>
function script2() {
    var e = document.getElementById("pippo");
    if (e.style.visibility == 'hidden') {
        e.style.visibility = 'visible';
        e.style.display = 'block';
    } else {
        e.style.visibility = 'hidden';
        e.style.display = 'none';
    }
}
</script>
<div id="pippo">
Io scompaio e appaio!
<img src="input_type.png" width="220" eight="69" />
</div>
<input type="button" value="Clicca per far sparire/ricomparire" onClick="script2()" />

non va. ci deve essere qualche problema altrove.
ho provato a dare comandi anche da console ma non mi vuole fare comparire il form.

marino51 · 3 Ott 2015

may be ... come sempre capisco poco,
ma senza il tuo codice (quanto hai postato è insufficiente), difficile leggere il tuo computer ... da remoto

in ogni caso, quello che segue è un altro esempio pubblicato qui ... qualche "discussione" fa che funziona bene
ciao
Marino

HTML:

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
<!--css-->
<link rel="stylesheet" type="text/css" href="jquery-ui.structure.css">
<link rel="stylesheet" type="text/css" href="jquery-ui.theme.css">
<!--css-->
<script src="jquery-1.11.3.min.js"></script>
<script src="jquery-ui.min.js"></script>

<script>
$(document).ready(function(){
//	test jquery
	var obj = document.getElementById("h01");
	obj.innerHTML = "Hello jQuery";

	$('#show-back').hide();
	$('#show-sx').hide();
	$('#show-dx').hide();

	$('#formid').on('click' ,'input[type=radio]', function(){
		if (this.id == "retro" && this.checked) {
			$('#show-back').show();
		} 
	});
    
	$('#formid').on('click' ,'input[type=radio]', function(){
		if (this.id == "sx" && this.checked) {
			$('#show-sx').show();
		} 
	});

	$('#formid').on('click' ,'input[type=radio]', function(){
		if (this.id == "dx" && this.checked) {
			$('#show-dx').show();
		} 
	});
});
</script>
</head>
<body>

<?php
echo 'test php' ;
?>

<div id="h01"> </div>

<form action="ricezione.php" method="POST" id="formid">

<p>FRONTE</p>
<p>Seleziona il tipo di personalizzazione che vuoi effettuare sul Fronte della t-shirt.</p>
<ul>
	<li><input type="radio" name="stampafronte" value="Nessuna Stampa" checked>Nessuna stampa</li>
	<li><input type="radio" name="stampafronte" value="1 colore" id="fronte">Stampa a 1 colore</li>
	<li><input type="radio" name="stampafronte" value="2 colori" id="fronte">Stampa a 2 colori </li> 
	<li><input type="radio" name="stampafronte" value="3 colori" id="fronte">Stampa a 3 colori </li>
	<li><input type="radio" name="stampafronte" value="4 colori" id="fronte">Stampa a 4 colori </li>
	<li><input type="radio" name="stampafronte" value="5 colori" id="fronte">Stampa a 5 colori </li>
	<li><input type="radio" name="stampafronte" value="6 colori" id="fronte">Stampa a 6 colori</li><hr>
    <li><input type="radio" name="stampafronte" value="6 colori" id="fronte">Ricamo</li>
</ul>

<p>RETRO</p>
<p>Seleziona il tipo di personalizzazione che vuoi effettuare sul Retro della t-shirt.</p>
<ul>
	<li><input type="radio" name="stamparetro" value="Nessuna Stampa" checked>Nessuna stampa</li>
	<li><input type="radio" name="stamparetro" value="1 colore" id="retro">Stampa a 1 colore</li>
	<li><input type="radio" name="stamparetro" value="2 colori" id="retro">Stampa a 2 colori </li> 
	<li><input type="radio" name="stamparetro" value="3 colori" id="retro">Stampa a 3 colori </li>
	<li><input type="radio" name="stamparetro" value="4 colori" id="retro">Stampa a 4 colori </li>
	<li><input type="radio" name="stamparetro" value="5 colori" id="retro">Stampa a 5 colori </li>
	<li><input type="radio" name="stamparetro" value="6 colori" id="retro">Stampa a 6 colori</li><hr>
    <li><input type="radio" name="stamparetro" value="6 colori" id="retro">Ricamo</li>
</ul>

<p>SPALLA SINISTRA</p>
<p>Seleziona il tipo di personalizzazione che vuoi effettuare sulla spalla sinistra</p>
<ul>
	<li><input type="radio" name="stampasinistra" value="Nessuna Stampa" checked>Nessuna stampa</li>
	<li><input type="radio" name="stampasinistra" value="1 colore" id="sx">Stampa a 1 colore</li>
	<li><input type="radio" name="stampasinistra" value="2 colori" id="sx">Stampa a 2 colori </li> 
	<li><input type="radio" name="stampasinistra" value="3 colori" id="sx">Stampa a 3 colori </li>
	<li><input type="radio" name="stampasinistra" value="4 colori" id="sx">Stampa a 4 colori </li>
	<li><input type="radio" name="stampasinistra" value="5 colori" id="sx">Stampa a 5 colori </li>
	<li><input type="radio" name="stampasinistra" value="6 colori" id="sx">Stampa a 6 colori</li><hr>
    <li><input type="radio" name="stampasinistra" value="6 colori" id="sx">Ricamo</li>
</ul>

<p>SPALLA DESTRA</p>
<p>Seleziona il tipo di personalizzazione che vuoi effettuare sulla spalla destra</p>
<ul>
	<li><input type="radio" name="stampadestra" value="Nessuna Stampa" checked>Nessuna stampa</li>
	<li><input type="radio" name="stampadestra" value="1 colore" id="dx">Stampa a 1 colore</li>
	<li><input type="radio" name="stampadestra" value="2 colori" id="dx">Stampa a 2 colori </li> 
	<li><input type="radio" name="stampadestra" value="3 colori" id="dx">Stampa a 3 colori </li>
	<li><input type="radio" name="stampadestra" value="4 colori" id="dx">Stampa a 4 colori </li>
	<li><input type="radio" name="stampadestra" value="5 colori" id="dx">Stampa a 5 colori </li>
	<li><input type="radio" name="stampadestra" value="6 colori" id="dx">Stampa a 6 colori</li><hr>
    <li><input type="radio" name="stampadestra" value="6 colori" id="dx">Ricamo</li>
</ul>

<div id="show_front"> <!-- cambio  fronte-->
<p>Cambio</p>
<ul>
	<li><input type="radio" name="cambio" value="Nessun Cambio" checked>Nessun cambio</li>
	<li><input type="radio" name="cambio" value="1colore" >1 colore</li>
	<li><input type="radio" name="cambio" value="2colore" >2 colori</li>
	<li><input type="radio" name="cambio" value="3colore" >3 colori</li>
	<li><input type="radio" name="cambio" value="4colore" >4 colori</li>
	<li><input type="radio" name="cambio" value="5colore" >5 colori</li>
	<li><input type="radio" name="cambio" value="6colore" >6 colori</li>	
</ul>
</div> <!-- cambio  fronte fine-->

<div id="show-back"> <!-- cambio  retro-->
<p> Dietro </p>
    <ul>
        <li><input type="radio" name="cambio_r" value="Nessun Cambio" >Nessun cambio</li>
        <li><input type="radio" name="cambio_r" value="1colore" >1 colore</li>
        <li><input type="radio" name="cambio_r" value="2colore" >2 colori</li>
        <li><input type="radio" name="cambio_r" value="3colore" >3 colori</li>
        <li><input type="radio" name="cambio_r" value="4colore" >4 colori</li>
        <li><input type="radio" name="cambio_r" value="5colore" >5 colori</li>
        <li><input type="radio" name="cambio_r" value="6colore" >6 colori</li>	
    </ul>
</div> <!-- cambio  retro -->

<div id="show-sx"> <!-- cambio  sinistra-->
<p>Sinistra</p>
    <ul>
        <li><input type="radio" name="cambio_s" value="Nessun Cambio" >Nessun cambio</li>
        <li><input type="radio" name="cambio_s" value="1colore" >1 colore</li>
        <li><input type="radio" name="cambio_s" value="2colore" >2 colori</li>
        <li><input type="radio" name="cambio_s" value="3colore" >3 colori</li>
        <li><input type="radio" name="cambio_s" value="4colore" >4 colori</li>
        <li><input type="radio" name="cambio_s" value="5colore" >5 colori</li>
        <li><input type="radio" name="cambio_s" value="6colore" >6 colori</li>	
    </ul>
</div> <!-- cambio  sinistra fine -->

<div id="show-dx"> <!-- cambio  destra-->
<p>Destra</p>
    <ul>
        <li><input type="radio" name="cambio_d" value="Nessun Cambio" >Nessun cambio</li>
        <li><input type="radio" name="cambio_d" value="1colore" >1 colore</li>
        <li><input type="radio" name="cambio_d" value="2colore" >2 colori</li>
        <li><input type="radio" name="cambio_d" value="3colore" >3 colori</li>
        <li><input type="radio" name="cambio_d" value="4colore" >4 colori</li>
        <li><input type="radio" name="cambio_d" value="5colore" >5 colori</li>
        <li><input type="radio" name="cambio_d" value="6colore" >6 colori</li>	
    </ul>
</div> <!-- cambio  destra fine -->

<button type="submit">Invia</button>
</form> 

</body>
</html>

akp · 4 Ott 2015

grazie, sono riuscito ad individuare il problema. non avevo inserito questi

HTML:

<script src="jquery-1.11.3.min.js"></script>
<script src="jquery-ui.min.js"></script>

.

Cerca

Cerca

display

akp

Utente Attivo

borgo italia

Super Moderatore

MikiProgrammer

Utente Attivo

akp

Utente Attivo

MikiProgrammer

Utente Attivo

akp

Utente Attivo

MikiProgrammer

Utente Attivo

marino51

Utente Attivo

akp

Utente Attivo

marino51

Utente Attivo

akp

Utente Attivo

Discussioni simili