jQuery 获取输入文本框中的值

Get the value in an input text box

提问by Bharanikumar

What are the ways to get and render an input value using jQuery?

使用 jQuery 获取和呈现输入值的方法有哪些？

Here is one:

这是一个：

$(document).ready(function() {
  $("#txt_name").keyup(function() {
    alert($(this).val());
  });
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.4.3/jquery.min.js"></script>
<input type="text" id="txt_name" />

回答by Conrad

//Get
var bla = $('#txt_name').val();

//Set
$('#txt_name').val(bla);

回答by RJD22

You can only select a value with the following two ways:

您只能通过以下两种方式选择一个值：

// First way to get a value
value = $("#txt_name").val(); 

// Second way to get a value
value = $("#txt_name").attr('value');

If you want to use straight JavaScript to get the value, here is how:

如果你想直接使用 JavaScript 来获取值，方法如下：

document.getElementById('txt_name').value 

回答by Artur79

There is one important thing to mention:

有一件重要的事情要提：

$("#txt_name").val();

will return the current real value of a text field, for example if the user typed something there after a page load.

将返回文本字段的当前实际值，例如，如果用户在页面加载后在那里输入了一些内容。

But:

但：

$("#txt_name").attr('value')

will return value from DOM/HTML.

将从 DOM/HTML 返回值。

回答by Nick Craver

You can get the valueattribute directly since you know it's an <input>element, but your current usage of .val()is already the current one.

您可以value直接获取该属性，因为您知道它是一个<input>元素，但是您当前使用的.val()已经是当前使用的。

For the above, just use .valueon the DOM element directly, like this:

对于上面的，.value直接在 DOM 元素上使用，就像这样：

$(document).ready(function(){
  $("#txt_name").keyup(function(){
    alert(this.value);
  });
});

回答by Simplans

You have to use various ways to get current value of an input element.

您必须使用各种方法来获取输入元素的当前值。

METHOD - 1

方法 - 1

If you want to use a simple .val(), try this:

如果你想使用一个简单的.val()，试试这个：

<input type="text" id="txt_name" />

Get values from Input

从输入中获取值

// use to select with DOM element.
$("input").val();

// use the id to select the element.
$("#txt_name").val();

// use type="text" with input to select the element
$("input:text").val();

Set value to Input

将值设置为输入

// use to add "text content" to the DOM element.
$("input").val("text content");

// use the id to add "text content" to the element.
$("#txt_name").val("text content");

// use type="text" with input to add "text content" to the element
$("input:text").val("text content");

METHOD - 2

方法 - 2

Use .attr()to get the content.

使用.attr()获取内容。

<input type="text" id="txt_name" value="" />

I just add one attribute to the input field. value=""attribute is the one who carry the text content that we entered in input field.

我只是在输入字段中添加一个属性。value=""属性是携带我们在输入字段中输入的文本内容的属性。

$("input").attr("value");

METHOD - 3

方法 - 3

you can use this one directly on your inputelement.

你可以直接在你的input元素上使用这个。

$("input").keyup(function(){
    alert(this.value);
});

回答by dilip kumbham

I think this function is missed here in previous answers:

我认为以前的答案中缺少此功能：

.val( function(index, value) ) 

回答by SO is full of Monkeys

You can get the value like this:

你可以得到这样的值：

this['inputname'].value

Where thisrefers to the form that contains the input.

wherethis是指包含输入的表单。

回答by Yuval

To get the textbox value, you can use the jQuery val()function.

要获取文本框值，您可以使用 jQueryval()函数。

For example,

例如，

$('input:textbox').val()– Get textbox value.

$('input:textbox').val()– 获取文本框值。

$('input:textbox').val("new text message")– Set the textbox value.

$('input:textbox').val("new text message")– 设置文本框值。

回答by Mikhail Sirotenko

For those who just like me are newbies in JS and getting undefinedinstead of text value make sure that your iddoesn't contain invalid characters.

对于那些像我一样是 JS 新手并且获取undefined而不是文本值的人，请确保您id不包含无效字符。

回答by Muddasir23

You can simply set the value in text box.

您可以简单地在文本框中设置值。

First, you get the value like

首先，你得到这样的价值

var getValue = $('#txt_name').val();

After getting a value set in input like

在输入中获得一个值后

$('#txt_name').val(getValue);