Як отримати значення текстового поля в JavaScript

97

Я намагаюся використовувати JavaScript, щоб отримати значення з текстового поля HTML, але значення не надходить після пробілу

Наприклад:

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

Я лише отримую: "програмне забезпечення" з вищезазначеного. Я використовую такий сценарій:

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

Як отримати повне значення: "інженер програмного забезпечення"?

javascript html

— Гнаніяр Зубайр
джерело

63

+1 Gumbo: "id" - це найпростіший спосіб доступу до елементів сторінки. IE (попередня версія 8) поверне речі з відповідним 'ім'ям', якщо він не зможе знайти нічого із заданим ідентифікатором, але це помилка.

я отримую лише "програмне забезпечення".

id-vs-name не вплине на це; Я підозрюю, що сталося - це те, що (всупереч прикладу коду) ви забули процитувати свій атрибут 'value':

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

— бобінець
джерело

77

У вашого елемента немає ідентифікатора, а лише ім'я. Таким чином, ви можете скористатися getElementsByName()методом, щоб отримати список усіх елементів з цим ім'ям:

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

Або ви присвоюєте ідентифікатор елементу:

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

— Гамбо
джерело

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);

проблема, яку ви не використовуєте для кодування для вхідних значень з форми, тому браузер не додає їх до ...

онтоп має деякі проблеми як операції кодування / декодування Unicode, тому використовуйте цю функцію кодування рядків / масивів

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);

— ферит
джерело

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>

— закара
джерело

4

Встановіть idатрибут inputдо txtJob. Під час дзвінка ваш веб-переглядач діє химерно getElementById.

— Даніель А. Білий
джерело

4

Якщо ви використовуєте ASP.NET, теги коду на стороні сервера в цих прикладах нижче нададуть точний ідентифікатор управління, навіть якщо ви використовуєте основні сторінки.

Javascript:

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

JQuery:

$("#<%= MyControlName.ClientID %>").val();

— Шаман
джерело

3

Якщо це у формі, то це було б:

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

Тоді ви б сказали в javascript:

var val= document.jojo.jobtitle.value

document.formname.elementname

— Джим
джерело

3

Надається, коли потрібно значення текстового поля. Простий:

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

var result = document.getElementById("textbox").value;

— Вікі Чадхарі
джерело

0

Якщо ви користуєтесь будь-яким контролем користувача та хочете отримати будь-які значення текстового поля, тоді ви можете використовувати наведений нижче код:

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

Тут, LE_OtherCostsDetails- це ім'я керування користувача та txtHomeOwnerInsuranceідентифікатор текстового поля.

— Ранджан Срівастава
джерело

0

Проблема в тому, що ти зробив крихітну помилку!

Це JS-код, який я використовую:

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

Не слід використовувати name = "". замість цього використовуйте id = "".

— 1010
джерело

0

Вам потрібно змінити код, як показано нижче: -

<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>

— Вішал Тхакур
джерело

0

оскільки ви використовували простір між інженером програмного забезпечення html / php не підтримуватиме простір між значенням під текстовим полем, ви повинні використовувати цей код. <input type="text" name="txtJob" value=software_engineer> Він буде працювати

— Вікас Шарма
джерело

0

 var jobValue=document.FormName.txtJob.value;

Спробуйте цей код вище.

jobValue: ім'я змінної.
FormName: Назва форми в html.
txtJob: Назва текстового поля

— 27 пікс
джерело

0

Це має бути просто, використовуючи 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
джерело

0

Встановити ідентифікатор для текстового поля. тобто

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

У JavaScript

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

В Jquery

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