在输入文本框中获取值


1004

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

这是一个:

$(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" />


1
使用以下代码:var value = $('#txt_Name')。val(); 您也可以使用jquery设置值。请在以下位置查看此帖子:coding-issues.blogspot.in/2013/10/…–
Ranadheer Reddy

Answers:


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

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

35
@Prabs,问题是:“使用jQuery获取和呈现输入值的方法是什么?”,标签不是输入。
巴里·迈克尔·道尔

3
删除'bla'中的引号。它应该是$('#txt_name')。val(bla);
查尔斯·泽维尔

9
@ParbhuBissessar不一定。如果他想要文字文本“ bla”,那么他说对了。如果他要的valvar bla则需要删除引号。
double_j

注意get的:“ val()”而不是“ val”,您可以看一下我的个人资料
TheRedstoneTaco

我做到了,但有问题。
Wasey Raza

591

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

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

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

如果要使用直接JavaScript来获取值,请按以下步骤操作:

document.getElementById('txt_name').value 

6
我知道这是一个比较老的问题,但是请不要忘记attr可能还会被替换prop。这在语义上更好。
Sablefoste 2012年

$("#txt_name").val(str);在Chrome中为我设置了值。试试这个帖子
gkiko

jQuery append函数在保留表单值的同时添加到HTML似乎没有问题。
亚当F

1
$(“#txt_name”)。attr('value'); 返回默认值/答案不正确!
zloctb

1
请记住,这$("#txt_name").attr('value')将始终返回属性“值”的内容,因此,如果更改输入字段,则值不会更改。.val()永诺将返回字段的内容..
honk31

84

有一件重要的事情要提到:

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

将返回文本字段的当前实际值,例如,如果用户在页面加载后在其中输入了某些内容。

但:

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

将从DOM / HTML返回值。


40

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

对于以上内容,只需.value直接在DOM元素上使用,如下所示

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

@Bharan为什么需要替代方法?
Doug Molineux 2010年

3
在某些地方,我想使用替代方法
Bharanikumar 2010年

16

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

方法-1

如果要使用simple .val(),请尝试以下操作:

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

从输入获取值

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

将值设置为输入

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

方法-2

使用.attr()获取内容。

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

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

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

方法-3

您可以直接在您的input元素上使用此元素。

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

15

您可以这样获得值:

this['inputname'].value

Where this是指包含输入的表单。


8
该答案假设this是指包含输入的表单。
nandan


6

要获取文本框值,可以使用jQuery val()函数。

例如,

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

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



3

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

首先,您获得像

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

在输入中获得值设置后

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

1

尝试这个。它肯定会工作。

var userInput = $('#txt_name').attr('value')

不,不会!(1)如果没有属性“值”(<input type="text" />),则返回未定义。(2)如果您这样做,<input type="text" value="test" />并且用户在输入字段中输入foo,则$('#txt_name').attr('value')仍然返回“
test。– ndsvw

这个答案不正确,但这是我正在寻找的API。
安东尼
By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.