Question

使用parse.com和javascript / jquery。

以下代码应该在“friendsearch”输入框中捕获用户的输入。

单击提交按钮后，它应查询parse.com后端并查明用户是否存在。目前我一直在“friendName”中返回“undefined”，我无法找出导致错误的原因或原因？

  <form class="Find Friend">

        <div class="error" style="display:none"></div>
        <input type="text" id="friendsearch" placeholder="Find Friend" class="input-field" required/> 
        <button type="submit" class="btn btn-login">Find</button> 
</form>

var friendName;

$('#friendsearch').on('keyup', function(e) {
   friendName = $(this).val();
});

var friendFinder = Parse.Object.extend("_User");
var query = new Parse.Query(Parse.User);
query.equalTo("username", friendName);  // find users that match
query.find({
success: function(friend) {
alert(friendName); 
  },
    error: function (error) {
 //Show if no user was found to match

 alert("Error: " + error.code + " " + error.message);
     }

});

Answer 1

我认为问题出在你分配friendName = $（this）.val（）;

的地方

尝试使用e.target获取对文本输入框中当前值的引用。我不确定它是不是我的头顶但是我很确定你想要一个包含在e参数中的属性。

尝试$（e.target）.val（）或$（e.currentTarget）.val（），而不是$（this）.val（）;

当我试图弄清楚为什么没有正确设置某些内容时，我还想做的是在chrome调试器中设置断点。在这种情况下，您可以将“调试器”放在您希望浏览器中断的代码中。所以在你的例子中，你可以这样写：

$('#friendsearch').on('keyup', function(e) {
    debugger
    friendName = $(this).val();
});

在您的Chrome开发者工具中，您可以检查e的值并确定可用的属性和值。

Answer 2

好的，我修改了你的代码，以便friendName变量实际上包含表单上输入框的内容。问题是您的原始代码在将其加载到DOM之前尝试访问输入框的内容。

尝试使用HTML：

<form class="Find Friend">
        <div class="error" style="display:none"></div>
        <input type="text" id="friendsearch" placeholder="Find Friend" class="input-field" /> 
        <button id="find_button" type="submit" class="btn btn-login">Find</button> 
</form>

这适用于您的javascript：

var friendName;

function findFriend(){
    friendName = $('#friendsearch').val();
    alert(friendName);

    var friendFinder = Parse.Object.extend("_User");

    var query = new Parse.Query(Parse.User);
    query.equalTo("username", friendName);  // find users that match
    query.find({
    success: function(friend) {
    alert(friendName); 
      },
        error: function (error) {
     //Show if no user was found to match

     alert("Error: " + error.code + " " + error.message);
         }

    });   
}

$('#find_button').click(function(e){
    findFriend();
});

我在这里更新了实时jsFiddle示例：http://jsfiddle.net/LWA48/2/

在jsFiddle示例中，当您单击按钮时，Parse对象会打印{“error”：“请使用POST请求”}，但至少您的friendName变量包含您在框中键入的名称！希望这可以带你完成剩下的工作。

无法在输入表单提交中捕获未定义的错误

2 个答案: