Cara mendapatkan nilai kotak teks di JavaScript

97

Saya mencoba menggunakan JavaScript untuk mendapatkan nilai dari kotak teks HTML tetapi nilainya tidak muncul setelah spasi

Sebagai contoh:

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

Saya hanya mendapatkan: "perangkat lunak" dari atas. Saya menggunakan skrip seperti ini:

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

Bagaimana cara mendapatkan nilai penuh: "insinyur perangkat lunak"?

javascript html Gnaniyar Zubair
sumber

Jawaban:

63

+1 Gumbo: 'id' adalah cara termudah untuk mengakses elemen halaman. IE (pra versi 8) akan mengembalikan sesuatu dengan 'nama' yang cocok jika tidak dapat menemukan apapun dengan ID yang diberikan, tetapi ini adalah bug.

saya hanya mendapatkan "perangkat lunak".

id-vs-name tidak akan mempengaruhi ini; Saya menduga apa yang terjadi adalah (bertentangan dengan kode contoh) Anda lupa mengutip atribut 'nilai' Anda:

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

Elemen Anda tidak memiliki ID tetapi hanya sebuah nama. Jadi Anda bisa menggunakan getElementsByName()metode untuk mendapatkan daftar semua elemen dengan nama ini:

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

Atau Anda menetapkan ID ke elemen:

<input type="text" name="txtJob" id="txtJob" value="software engineer">
Gumbo
sumber
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);

masalah Anda tidak menggunakan pengkodean untuk nilai input dari formulir sehingga browser tidak menambahkannya ke ...

ontop memiliki beberapa masalah seperti unicode encoding / decoding operasi jadi gunakan fungsi ini encoding string / array

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

Setel idatribut inputke txtJob. Browser Anda bertingkah aneh saat Anda menelepon getElementById.

Daniel A. White
sumber
4

Jika Anda menggunakan ASP.NET, tag kode sisi server dalam contoh di bawah ini akan memberikan ID kontrol yang tepat, meskipun Anda menggunakan halaman Master.

Javascript:

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

JQuery:

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

Jika sudah dalam bentuk maka akan menjadi:

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

Kemudian Anda akan berkata dalam javascript:

var val= document.jojo.jobtitle.value

document.formname.elementname
Jim
sumber
3

Diberikan saat Anda menginginkan nilai kotak teks. Sederhana:

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

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

Jika Anda menggunakan kontrol pengguna dan ingin mendapatkan nilai kotak teks apa pun, Anda dapat menggunakan kode di bawah ini:

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

Di sini,, LE_OtherCostsDetailsadalah nama kontrol pengguna dan txtHomeOwnerInsurancemerupakan id kotak teks.

Ranjan Srivastava
sumber
0



Masalahnya adalah Anda membuat kesalahan kecil!

Ini adalah kode JS yang saya gunakan:

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

Anda tidak boleh menggunakan name = "". alih-alih gunakan id = "".

1010
sumber
0

Anda Perlu mengubah kode Anda seperti di bawah ini: -

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

karena Anda menggunakan spasi antara software engineer html / php tidak akan mendukung spasi antara nilai di bawah kotak teks, Anda harus menggunakan kode ini. <input type="text" name="txtJob" value=software_engineer> Ini akan berfungsi

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

Coba kode di atas.

jobValue: nama variabel.
FormName: Nama formulir di html.
txtJob: Nama kotak teks

27px
sumber
0

Ini harus sederhana menggunakan 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
sumber
0

Setel id untuk kotak teks. yaitu,

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

Dalam javascript 

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

Di Jquery

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

sumber