无法检索用户输入

所以基本上我试图创建一个更互动的日期选择器。我是这样做的，首先允许用户输入他们的名字。一旦他们提交，现在应该说...你好“用户的名字”。无法检索用户输入

但由于某种原因，我使用的if else语句不起作用。我查看了我的代码，它看起来是正确的，但用户输入不会打印出来。它还应该检查输入是否是字符串，它会继续。如果它只是一个字符串，就像一个数字一样，它会输出到屏幕上......“你必须告诉我们你的名字继续前进！”。如何对用户输入的任何内容使用if else语句？有人可以看看我的代码并帮助我吗？我已经四处寻找，并没有发现沿这些线路。也许这是重复的，或者我完全错误地解决了这个问题，我只是不确定。感谢您的帮助。为使这一点更好的建议也将受到高度赞赏！ :)

的HTML：

<!DOCTYPE html> 
<html> 
<head> 
    <title>Going On Vacation!</title> 
    <link type="text/css" rel="stylesheet" href="stylesheet.css"/> 
</head> 
<body> 

    <h1>Heading Somewhere?</h1> 
    <div id="main"> 
    <h2>What is your name?</h2> 
     <input id="name" type= "text" placeholder=" Tell us!"> 

     <button id ="submit">Submit!</button> 
    </div> 

     <p id="user"></p> 
     <p id="when"></p> 
     <input id="date" placeholder="Choose your departure!"> 
     <p id="error1"></p> 
     <script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/jquery-ui.min.js"></script> 
    <script type="text/javascript" src="script.js"></script> 
</body> 
</html>

的JavaScript：

$('#date').hide(); 

function userName(){ 
var user_name = $('#name').val(); 
$('#submit').click(function(){ 
if(typeof user_name === 'string'){ 
    $('#main').hide('slow'); 
     document.getElementById("user").innerHTML = "Hello " + user_name + "!"; 
     $('#user').css("margin-left", "641px"); 
     $('#when').css("margin-left", "598px"); 
     document.getElementById("when").innerHTML = "When are you leaving?"; 
     $('#date').show(); 
     $('#date').datepicker(); 
    } else { 
     document.getElementById("error1").innerHTML = "You must tell us your name to move on!"; 
    } 
    }); 
}; 


$(document).ready(userName);

来源

2015-01-01 Jordan Creary-Spencer

什么问题？ – FrEaKmAn

@FrEaKmAn我如何使用if语句来处理用户输入的任何内容？ –

，因为你是用户在填写前阅读的用户名外地它不工作！

var user_name = $('#name').val();

该行需要INSIDE提交方法。

其次，检查类型没有意义。你想要检查长度。

$('#submit').click(function(){ 
    var user_name = $.trim($('#name').val()); 
    if(user_name.length>0){

来源

2015-01-01 15:09:14 epascarello

工作正常！谢谢！但是，即使我使用if（typeof user_name ==='string'）和else语句，用户仍然可以继续输入数字，为什么？ –

因为它是一个字符串....“3”是一个字符串...这不是一个数字。 val（）给出一个字符串，它不会将输入转换为该类型。 – epascarello

哦，好吧我明白了，我没在想，非常感谢你！ –

user_name超出范围。只是移动用户声明VAR到内提交事件：

function userName(){ 
    $('#submit').click(function(){ 
     var user_name = $('#name').val(); 
    if(typeof user_name === 'string'){ 
     $('#main').hide('slow'); 
      document.getElementById("user").innerHTML = "Hello " + user_name + "!"; 
      $('#user').css("margin-left", "641px"); 
      $('#when').css("margin-left", "598px"); 
      document.getElementById("when").innerHTML = "When are you leaving?"; 
      $('#date').show(); 
      $('#date').datepicker(); 
     } else { 
      document.getElementById("error1").innerHTML = "You must tell us your name to move on!"; 
     } 
     }); 
    };

，如果你不想jQuery的每次用户点击提交时间寻找在DOM对象。您可以在范围外找到该对象，但必须在提交事件中检索该值。例如：

... 
var userObj = $('#name'); 
$('#submit').click(function(){ 
      var user_name = userObj.val(); 
...

来源

2015-01-01 15:10:31 nanndoj

因为jQuery val（）将始终返回一个字符串。你应该用你自己的方式来检查用户输入的号码。 – nanndoj

非常感谢！ –

无法检索用户输入

回答

相关问题