Javascript: comment changer la forme valeur des champs avec un seul clic

Question

Je suis en train de définir la valeur de trois différents champs de saisie de texte avec une fonction onclick.

j'ai une image qui a ce code ...

<img src="images/delete_row.png" width="25" onClick="clearRow(0);" /> 

et moi avons trois champs de saisie de texte qui ont tous l'id de « 0 ».

Lorsque je clique sur mon image que je veux définir la valeur des trois champs à vide.

Quelqu'un peut-il me aider à écrire s'il vous plaît une fonction qui peut le faire?

Merci!

Answer 1

D'abord, vous avez besoin que vos valeurs id soient différentes. Vous ne devriez jamais avoir deux fois le même identifiant sur la même page. permet donc l'utiliser comme l'exemple HTML:

<input type="text" id="name_0" name="name" /> 
<input type="text" id="phone_0" name="phone" /> 
<input type="text" id="email_0" name="email" /> 

Vous pouvez utiliser cette fonction JavaScript:

<script type='text/javascript'> 
    function clearRow(id){ 
    var name = document.getElementById('name_' + id), 
     phone = document.getElementById('phone_' + id), 
     email = document.getElementById('email_' + id); 

    // Clear values 
    name.value = phone.value = email.value = ""; 
    } 
</script> 

Et votre balise img demeurerait inchangé:

<img src="images/delete_row.png" width="25" onClick="clearRow(0);" /> 

Answer 2

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> 

<script> 
$(document).ready(function() { 
    $('#pic').click(function() { 
    alert('Clicked on pic - resetting fields') 
    $('.field').val('') 
    }) 
} 
</script> 

<img id="pic" src="image.png"> 
<input class="field" value="1"> 
<input class="field" value="2"> 
<input class="field" value="4"> 
<input class="field" value="5"> 
<input class="field" value="6"> 
<input class="field" value="7"> 
<input class="field" value="8"> 
<input class="field" value="9"> 
<input class="field" value="10"> 

Answer 3

J'ai trois Les champs de texte d'entrée ont tous l'ID "0".

Ceci est tout à fait tort. Dans un document, vous ne pouvez pas avoir un élément avec le même identifiant. Soit utiliser un nom ou un nom de classe pour ces champs de texte et rendre leurs identifiants différents.

<script type="text/javascript"> 
    function Change() 
    { 
     var elems = document.getElementsByName ("myfields"); 
     for (var i = 0;i < elems.length; i++) 
     { 
      elems[i].value = ""; 
     } 
    } 
</script> 
<input name="myfields" type="text" id="txt1" /> 
<input name="myfields" type="text" id="txt2" /> 
<input name="myfields" type="text" id="txt3" /> 
<img onclick="Change();" alt="test" src="yourimagpath" />