0
votes

Changer le champ d'entrée de couleur en cliquant sur

J'utilise bootstrap 4 et je veux changer la couleur d'arrière-plan d'un champ d'entrée en cliquant sur le bouton.

Voici mon code: p>

<input type="button" class="btn btn-danger" value="Berechnen" onClick="sumValues()">

javascript jquery html css

1 commentaires

Quel est votre code jQuery jusqu'à présent? À quel élément voulez-vous changer la couleur de fond?

5 Réponses :

0
votes

Utiliser CSS () code> pour changer de bgcolor en cliquant sur le bouton

p>



<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

 <div class="form-group row">
            <label for="staticEmail" class="col-sm-2 col-form-label">Dein Ersparniss / Jahr</label>
            <div class="col-sm-10">
                <input type="text" class="form-control" name="txtres" readonly>
                <input type="button" class="btn btn-danger" value="Berechnen" onClick="sumValues()">
            </div>
        </div>

0 commentaires

1
votes

.CSS ('fond-couleur', 'bleu') code> Utilisez cette méthode sur votre entrée que vous souhaitez modifier la couleur. Vous accédez à l'entrée par nom comme ceci $ (entrée [nom = "txtres"] ') code>

p>



<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="form-group row">
            <label for="staticEmail" class="col-sm-2 col-form-label">Dein Ersparniss / Jahr</label>
            <div class="col-sm-10">
                <input type="text" class="form-control" name="txtres" readonly>
            </div>
        </div>
<input type="button" class="btn btn-danger" value="Berechnen" onclick="sumValues()">

0 commentaires

1
votes

Vous pouvez ajouter un événement .Click code> à votre bouton, puis modifiez la couleur de votre champ d'entrée à l'aide de .css () code>:

p>


<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="form-group row">
  <label for="staticEmail" class="col-sm-2 col-form-label">Dein Ersparniss / Jahr</label>
  <div class="col-sm-10">
    <input value="Some text" class="input-color" type="text" class="form-control" name="txtres" readonly />
  </div>
</div>

<input type="button" class="color-btn btn btn-danger" value="Berechnen" />

0 commentaires

0
votes

C'est ce que je ferais

<div class="form-group row">
  <label for="staticEmail" class="col-sm-2 col-form-label">Dein Ersparniss / Jahr</label>
  <div class="col-sm-10">
    <input type="text" class="form-control" name="txtres" readonly>
  </div>
</div>

<input type="button" class="btn btn-danger" value="Berechnen" onClick="sumValues()">

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

0 commentaires

0
votes

Vous pouvez également créer une classe CSS code> avec la couleur code> de fond code>, puis ajoutez que classe code> Pour entrer lorsque bouton code> est cliqué sur. C'est juste une autre façon de le faire:

p>



<div class="form-group row">
  <label for="staticEmail" class="col-sm-2 col-form-label">Dein Ersparniss / Jahr</label>
  <div class="col-sm-10">
    <input type="text" class="form-control" name="txtres" readonly>
  </div>
</div>

<input type="button" class="btn btn-danger" value="Berechnen" onClick="sumValues()">

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

0 commentaires