click et .removeClass

**Antitrox** · 12/09/2014, 15h36

Bonjour,
je cherche à afficher certaines parties d'un formulaire quand on a coché si oui ou non on veut les voir, je tâtonne en vain depuis un moment, je ne sais pas si je m'y prends de la bonne façon, quelqu'un pourrait m'aider s'il vous plait ?

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
 $("#osoui").click(function() {
  $(".jesaispas").removeClass("current");
});

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
<form class="formUO">
    <span class="ligne"><label class="col1">OS</label>
        <span class="col2">Oui<input id="osoui" type="checkbox" name="oui"/> Non<input type="checkbox" name="non" id="osnon" /></span>
        <span class="jesaispas col3 current"><input type="text" name="OS" /></span></span>
</form>

voici en image un exemple concret si je me suis mal exprimé :

PS: j'ai aussi fait quelques tentatives du genre :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
$('#osoui').change(function(){
  if($(this).is(':checked')){
    $('.current').show();
  }else{
    $('.current').hide();
  }
});

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
<form class="formUO">
 
    <span class="ligne"><label class="col1">OS</label>
 
        <span class="col2">Oui<input id="osoui" onclick="var champ = document.getElementById('champ'); if(this.checked) champ.style.visibility = 'visible'; else champ.style.visibility = 'hidden';" type="checkbox" name="oui"/> Non<input type="checkbox" name="non" id="osnon" /></span>
 
        <span class="jesaispas col3 current"><input id="champ" type="text" name="OS" style="visibility: hidden;" /></span></span>
 
</form>

**darkterreur** · 15/09/2014, 19h03

Bonjour,

Alors plusieurs remarque, dans un premier temps ta manière de faire du html est quelque peut étrange.

Je ne connais pas la démarche exacte de ce que tu veux faire mais fait plutôt

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
 <input id="osoui" type="checkbox" name="oui" value="oui"/>
<input type="checkbox" name="non" id="osnon" value="non" />

ou alors

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
<span class="col2">oui</span>
<span class="col2">non</span>

ce sera déjà plus clair pour l'exécution et la compréhension
ensuite pour le reste que souhaite tu afficher ?
car pour ".current" d'après ton code tu ne verra pas grand chose.
il te faut soit quelque chose entre les deux "span" soit une value a ton "input"

quand à ceci l'idée est bonne mais la bonne syntaxe est celle-ci

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
$("#osoui").click(function() {
  $(".jesaispas").removeClass("current");
});

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
$('.formUO').on('click', '#osoui', function() {
ton code
….
})

Voila

**Franck.H** · 18/09/2014, 13h15

Je t'ai fait un petit exemple si c'est bien ce que tu veux faire:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Saisie Labo</title>
    <script src="jquery-2.1.1.min.js"></script>
 
    <style>
        div
        {
            height: 100px;
            width: 90%;
            background-color: gray;
            margin: 20px;
        }
 
        .div-display
        {
            display: none;
        }
    </style>
 
    <script type="text/javascript" language="javascript">
        $(document).ready(function () {
            $('#div1').on('click', function(e) {
               $('#div2').toggleClass('div-display');
            });
        });
    </script>
</head>
<body>
    <div id="div1"></div>
    <div id="div2"></div>
</body>
</html>

click et .removeClass

jQuery

Discussions similaires

Partager

Partager