Référence le champ de texte que je suis quand j'appuyez sur Entrée

Javascript/jQuery (ne fonctionne pas comment je veux qu'il):Référence le champ de texte que je suis quand j'appuyez sur Entrée

function chkKey(event) { 
    if (event.keyCode == 13) { 
     $(this).val("value", "wow such code"); 
    }; 
};

Je ne veux pas faire référence au champ de texte par nom parce que je vais avoir plusieurs champs de texte sur la page avec des noms différents qui utilisent la même fonction chkKey. Je dois référencer le champ de texte dans lequel je suis actuellement, quel que soit le nom. Est-ce possible? Je pense que c'est un problème parent/bouillonnant, mais je n'ai pas d'expérience avec ces choses du tout.

EDIT: complet HTML/JS:

<!DOCTYPE html> 
<html> 

<head> 
    <meta charset="utf-8" name="viewport" content="width=device-width, initial-scale=1.0" /> 
    <title>Boxes and Lines</title> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> 
</head> 

<body> 
    <div id="outerDiv"> 
     <input type="button" name="btnNewField" value="Add New Field" onclick="appendNewField()"> 
     <p></p> 
     <div id="mainDiv"></div> 
    </div> 

    <script> 
     function chkKey(event) { 
      if (event.keyCode == 13) { 
       $(this).val("value", "wow"); 
      }; 
     }; 

     // returns a text field object 
     function txtField(fieldName, fieldVal){ 
      var objTxtField = document.createElement("input"); 
      $(objTxtField).attr({ 
       type: "text", 
       name: fieldName, 
       value: fieldVal, 
       onkeyup: "chkKey(event)" 
      }); 
      return objTxtField; 
     }; 

     // if there is no appended text field, create one and give it focus 
     function appendNewField() { 
      if ($("#mainDiv").find('[name="appTxtField"]').length === 0) { 
       $(new txtField("appTxtField", "")).appendTo($("#mainDiv")).focus(); 
      }; 
     }; 
    </script> 
</body> 
</html>

Source

2015-09-30 Kris Hanson

Pouvez-vous ajouter le code HTML complet – Tushar

Code HTML/JS complet ajouté. –

Il y a deux erreurs dans votre code:

Utilisation val comme il était attr ou prop, mais il attend un seul paramètre
En essayant d'ajouter un gestionnaire d'événements keyup avec attr, vous devriez utiliser on

Jetez un oeil à votre code ci-dessous, fixe les éléments ci-dessus:

function chkKey(event) { 
 
    if (event.keyCode == 13) { 
 
     $(this).val("wow such code"); 
 
    }; 
 
}; 
 

 
// returns a text field object 
 
function txtField(fieldName, fieldVal){ 
 
    var objTxtField = document.createElement("input"); 
 
    $(objTxtField).attr({ 
 
     type: "text", 
 
     name: fieldName, 
 
     value: fieldVal 
 
    }).on('keyup', chkKey); 
 
    
 
    return objTxtField; 
 
}; 
 

 

 
// if there is no appended text field, create one and give it focus 
 
function appendNewField() { 
 
    if ($("#mainDiv").find('[name="appTxtField"]').length === 0) { 
 
     $(new txtField("appTxtField", "")).appendTo($("#mainDiv")).focus(); 
 
    }; 
 
}; 
 

 
appendNewField()

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<div id="mainDiv"></div>

Source

2015-09-30 03:43:11 Buzinas

Fonctionne comme un charme. Merci pour les corrections. –

onkeyup: "chkKey(event, this)" passera l'élément courant à la fonction.

Source

2015-09-30 03:47:12 hooda

Je ne savais pas que c'était possible. Je vais certainement utiliser cela à l'avenir. –

Référence le champ de texte que je suis quand j'appuyez sur Entrée

Répondre

Questions connexes