Comment obtenir la valeur de la zone de texte en JavaScript

97

J'essaie d'utiliser JavaScript pour obtenir la valeur d'une zone de texte HTML, mais la valeur ne vient pas après l'espace blanc

Par exemple:

<input type="text" name="txtJob" value="software engineer">

Je reçois seulement: "logiciel" de ce qui précède. J'utilise un script comme celui-ci:

var jobValue = document.getElementById('txtJob').value

Comment obtenir la valeur totale: «ingénieur logiciel»?

Gnaniyar Zubair
la source

Réponses:

63

+1 Gumbo: «id» est le moyen le plus simple d'accéder aux éléments de la page. IE (version antérieure 8) renverra des éléments avec un 'nom' correspondant s'il ne trouve rien avec l'ID donné, mais c'est un bogue.

je reçois uniquement des "logiciels".

id-vs-name n'affectera pas cela; Je suppose que ce qui s'est passé est que (contrairement à l'exemple de code) vous avez oublié de citer votre attribut 'value':

<input type="text" name="txtJob" value=software engineer>
bobince
la source
77

Votre élément n'a pas d'identifiant mais juste un nom. Vous pouvez donc utiliser la getElementsByName()méthode pour obtenir une liste de tous les éléments avec ce nom:

var jobValue = document.getElementsByName('txtJob')[0].value  // first element in DOM  (index 0) with name="txtJob"

Ou vous attribuez un identifiant à l'élément:

<input type="text" name="txtJob" id="txtJob" value="software engineer">
Gombo
la source
11
var word = document.getElementById("word").value;//by id
or
var word = document.forms[0].elements[0].value;//by index
//word = a word from form input
var kodlandi = escape(word);//apply url encoding

alert(escape(word));
or
alert(kodlandi);

le problème que vous n'utilisez pas d'encodage pour les valeurs d'entrée du formulaire, donc pas le navigateur en ajoute des à ...

ontop a quelques problèmes en tant qu'opérations d'encodage / décodage unicode, utilisez donc cette fonction d'encodage de chaînes / tableaux

function urlencode( str ) 
{
// http://kevin.vanzonneveld.net3.    
// +   original by: Philip Peterson4.    
// +   improved by: Kevin van Zonneveld (http://kevin.vanzonneveld.net)5.    
// *     example 1: urlencode('Kevin van Zonneveld!');
// *     returns 1: 'Kevin+van+Zonneveld%21'7. 
   var ret = str; 
   ret = ret.toString();
   ret = encodeURIComponent(ret);
   ret = ret.replace(/%20/g, '+');
   return ret;
}


ex.
var word = "some word";
word = urlencode(word);
ferit
la source
7
<!DOCTYPE html>
<html>
<body>
<label>Enter your Name here: </label><br>
<input type= text id="namehere" onchange="displayname()"><br>


<script>
function displayname() {
    document.getElementById("demo").innerHTML = 
document.getElementById("namehere").value;
}

</script>


<p id="demo"></p>

</body>
</html> 
Zakara
la source
4

Définissez l' idattribut du inputsur txtJob. Votre navigateur se comporte de manière bizarre lorsque vous appelez getElementById.

Daniel A. White
la source
4

Si vous utilisez ASP.NET, les balises de code côté serveur dans les exemples ci-dessous fourniront l'ID de contrôle exact, même si vous utilisez des pages maîtres.

Javascript:

document.getElementById("<%=MyControlName.ClientID%>").value;

JQuery:

$("#<%= MyControlName.ClientID %>").val();
Faux
la source
3

Si c'est sous une forme, ce serait:

<form name="jojo">
<input name="jobtitle">
</form>

Ensuite, vous diriez en javascript:

var val= document.jojo.jobtitle.value

document.formname.elementname
Jim
la source
3

Fourni lorsque vous voulez la valeur de la zone de texte. Un simple:

<input type="text" value="software engineer" id="textbox">

var result = document.getElementById("textbox").value;
Vicky Chaudhary
la source
0

Si vous utilisez un contrôle utilisateur et souhaitez obtenir des valeurs de zone de texte, vous pouvez utiliser le code ci-dessous:

var result = document.getElementById('LE_OtherCostsDetails_txtHomeOwnerInsurance').value;

Ici, LE_OtherCostsDetailsest le nom du contrôle utilisateur et txtHomeOwnerInsuranceest l'ID de la zone de texte.

Ranjan Srivastava
la source
0



Le problème est que vous avez fait une petite erreur!

Voici le code JS que j'utilise:

var jobName = document.getElementById("txtJob").value;

Vous ne devez pas utiliser name = "". à la place, utilisez id = "".

1010
la source
0

Vous devez changer votre code comme ci-dessous: -

<html>
<body>
<div>
<form align="center" method=post>
    <input id="mainText" type="text" align="center"placeholder="Search">

    <input type="submit" onclick="myFunction()" style="position: absolute; left: 450px"/>
</form>
</div>
<script>
function myFunction(){
    $a= document.getElementById("mainText").value;
    alert($a);
        }
</script>
</body>
</html>
Vishal Thakur
la source
0

parce que vous avez utilisé l'espace entre l'ingénieur logiciel html / php ne supportera pas l'espace entre la valeur sous la zone de texte, vous devez utiliser ce code <input type="text" name="txtJob" value=software_engineer> Cela fonctionnera

Vikas Sharma
la source
0
 var jobValue=document.FormName.txtJob.value;

Essayez ce code ci-dessus.

jobValue: nom de la variable.
FormName: nom du formulaire en html.
txtJob: nom de la zone de texte

27px
la source
0

Cela devrait être simple en utilisant jquery:

HTML:

  <input type="text" name="txtJob" value="software engineer">

JS:

  var jobValue = $('#txtJob').val(); //Get the text field value
  $('#txtJob').val(jobValue);        //Set the text field value
JamesC
la source
0

Définissez l'identifiant de la zone de texte. c'est à dire,

<input type="text" name="txtJob" value="software engineer" id="txtJob"> 

En javascript

var jobValue = document.getElementById('txtJob').value

Dans Jquery

 var jobValue =  $("#txtJob").val();

la source