jQuery .val（）与.attr（“value”）
我曾以为这两个是一样的，但他们似乎不是。 我通常使用$obj.attr("value")来处理表单字段，但是在我正在构build的页面上， $obj.attr("value")不会返回我在字段中input的文本。 但是， $obj.val() 。
在我创build的另一个页面上， $obj.attr("value")和$obj.val()返回在表单域中input的文本。
什么可以解释$obj.attr("value")在一个案例中按预期工作，但在另一个案例中没有？
什么是使用jQuery设置和检索表单字段值的正确方法？
对象属性和对象属性之间有很大的区别
看到这个问题（及其答案）的一些差异： .prop（）vs .attr（）
要点是.attr(...)只是在开始时（当html被创build时）获取对象值。 val()得到的对象的属性值可以改变很多次。
由于jQuery 1.6， attr()将返回属性的原始值（标记本身的值）。 您需要使用prop（）来获取当前值：
var currentValue = $obj.prop("value");
但是，使用val（）并不总是相同的。 例如， <select>元素的值实际上是它们所选选项的值。 val()考虑到这一点，但prop()不。 出于这个原因， val()是首选。
PS：这不是一个答案，但只是上述答案的补充。
为了将来的参考，我列举了一个很好的例子，可以帮助我们澄清我们的疑问：
尝试以下。 在这个例子中，我将创build一个文件select器，它可以用来select一个文件，然后我将尝试检索我select的文件的名称： html代码如下 ：
<html> <body> <form action="#" method="post"> <input id ="myfile" type="file"/> </form> <script type="text/javascript" src="jquery.js"> </script> <script type="text/javascript" src="code.js"> </script> </body> </html>
code.js文件包含以下jQuery代码。 尝试使用两个jQuery代码片断一个接一个，看看输出。
带有attr（'value'）的jQuery代码：
$('#myfile').change(function(){ alert($(this).attr('value')); $('#mybutton').removeAttr('disabled'); });
带有val（）的jQuery代码：
$('#myfile').change(function(){ alert($(this).val()); $('#mybutton').removeAttr('disabled'); });
输出：
带有attr（'value'）的jQuery代码的输出将是'undefined'。 带有val（）的jQuery代码的输出将会是你select的文件名。
说明 ：现在你可以很容易地理解最想要传达的答案。 带有attr（'value'）的jQuery代码的输出将是'undefined'，因为最初没有select文件，所以value是未定义的。 最好使用val（），因为它获取当前值。
为了明白为什么未定义的值被返回，请在你的html中试试这个代码，你会发现attr。（'value'）总是返回'test'，因为这个值是'test'，而且以前它是未定义的。
<input id ="myfile" type="file" value='test'/>
我希望这对你有用。
为了获得任何input字段的value ，你应该总是使用$element.val()因为jQuery处理基于元素types的浏览器来回收正确的值。
设置和获取表单字段值的正确方法是使用.val()方法。
$('#field').val('test'); // Set var value = $('#field').val(); // Get
使用jQuery 1.6有一个新的方法称为.prop() 。
从jQuery 1.6开始，
.attr()方法对于尚未设置的属性返回undefined。 另外，.attr（）不应该用于普通对象，数组，窗口或文档。 要检索和更改DOM属性，请使用.prop（）方法。
jQuery('.changer').change(function () { var addressdata = jQuery('option:selected', this).attr('address'); jQuery("#showadd").text(addressdata); });
jQuery(".morepost").live("click", function() { var loadID = jQuery(this).attr('id'); //get the id alert(loadID); });
你也可以使用.attr（）获取id的值
例子更多… attr（）是各种各样的，val（）只是一个！ 支柱是布尔是不同的。
//EXAMPLE 1 - RESULT $('div').append($('input.idone').attr('value')).append('<br>'); $('div').append($('input[name=nametwo]').attr('family')).append('<br>'); $('div').append($('input#idtwo').attr('name')).append('<br>'); $('div').append($('input[name=nameone]').attr('value')); $('div').append('<hr>'); //EXAMPLE 2 $('div').append($('input.idone').val()).append('<br>'); $('div').append('<hr>'); //EXAMPLE 3 - MODIFY VAL $('div').append($('input.idone').val('idonenew')).append('<br>'); $('input.idone').attr('type','initial'); $('div').append('<hr>'); //EXAMPLE 3 - MODIFY VALUE $('div').append($('input[name=nametwo]').attr('value', 'new-jquery-pro')).append('<br>'); $('input#idtwo').attr('type','initial');
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> <input type="hidden" class="idone" name="nameone" value="one-test" family="family-number-one"> <input type="hidden" id="idtwo" name="nametwo" value="two-test" family="family-number-two"> <br> <div></div>
在attr('value')你特别说你正在寻找一个名为vaule的属性的vaule 。 最好使用val()因为这是jQuery的开箱即用function，用于从表单元素中提取值。
我一直使用.val() ，说实话，我甚至不知道你可以使用.attr("value") 。 我使用.val（）以及ex来设置表单字段的值。 $('#myfield').val('New Value');
