Question

我正在使用jQuery和AJAX响应动态创建登录表单。表单已创建并正确显示。但是，我无法读取表单数据。

这是我的代码：

$(document).ready(function(){
  $('#proper-form').on( 'click', '#submit-button', function() {  // loginForm is submitted

alert ("here");
    var username = $('#email').attr('value'); // get username
    var password = $('#password').attr('value'); // get password
alert (password);
alert (username);

    // code for form submit using ajax

 }); 
});

警告undefined undefined用户名和密码。

有谁能帮我弄清楚这里有什么问题？

Answer 1

只需使用val()函数即可获取值：

 var username = $('#email').val(); 
 var password = $('#password').val();

设置值使用val(value)功能：

$('#email').val('some new value');

Answer 2

您需要使用.val（）来读取输入元素的值，而不是属性

var username = $('#email').val();

Answer 3

这里已经有了很好的答案，但我认为你应该理解为什么使用.attr（）不起作用，即使value确实是输入字段的属性。

使用时 $（ '＃电子邮件'）。ATTR（ '值'）;, 这等同于：

    input.getAttribute('value'),

将返回“某事”：

    <input type="text"value="something"/>

无论用户输入什么内容。

然而，使用 $('#email').val() 等同于： input.value将返回用户实际键入字段的任何内容。

在这种情况下，您没有隐式设置值=“”：您只需要用户输入的内容。

因此，请使用.val()。

Answer 4

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){             
$("#test").click(function(){ 
//textbox            
        var first_name = $("#first_name").val();
        alert(first_name);
 });
 });
</script>
<div>username <input type="text" id="first_name" class="first_name" name="first_name" placeholder="type username"/>
<a href="javascript:void(0)" id="test" class="shortc-button small blue">Get Data</a></div>

有关详细信息，请访问：http://www.codingprogrammer.com/tutorialdemo/jquery-tutorial/get-value-of-textbox-in-jquery-example/

使用jQuery获取文本框的值

4 个答案: