在JQuery中捕获表单输入

Question

现在我已经使用通用按钮设置了我的表单。使用提交会更容易吗？ 我试图捕获用户输入，然后将其作为URL的一部分传递。使用.find一直在给我一些其他的东西。

div class="username-input form-horizontal"> 
    <!-- <div class="form-group"> --> 
    <label for="inputUsername" class="col-sm-3 control-label">Username</label> 
    <div class="col-sm-5"> 
    <input type="text" value="Username" id="inputUsername"> 
    </div> 
    </div> 
    <button class="signup-button col-sm-1 control-label"> Sign in </button> 
<script> 

$(document).ready(function() { 
    $(".signup-button").click(function() { 
     var usernameInput = $('form').find('input[type=text]') 
     console.log(usernameInput) 
    }); 
}); 

Answer 1

您正在访问的元素不是值。使用val它

var usernameInput = $('form').find('input[type=text]').val(); // now you get input 

Answer 2

既然你输入字段ID &它应该是唯一的，所以你可以使用ID作为选择也。

var name = $("#inputUsername").val(); 

Answer 3

您必须访问值。这是您可以访问输入文本值的方式。

$(document).ready(function() { 
    $(".signup-button").click(function() { 
     var usernameInput = $('#inputUsername').val(); 
     console.log(usernameInput); 
    }); 
});