带有空结果的 AJAX 请求 - 清除我们的 HTML 输入字段答案

【问题标题】：AJAX Request with empty result - clear our HTML input field带有空结果的 AJAX 请求 - 清除我们的 HTML 输入字段
【发布时间】：2016-03-23 10:17:21
【问题描述】：

我有一个选择菜单，当用户进行选择时，它会向 PHP 脚本发出 AJAX 请求以查询数据库并返回与选择匹配的值并将其插入到关联的输入字段中。

这一切都很好，但是我现在需要解决可能返回空结果的可能性（直到现在总是返回匹配结果）。如果是这种情况，则需要从关联的输入字段中删除值/清除此输入字段。

以下是成功的 AJAX 请求返回的内容（JSON 数据）：

[{"senderMobile":"0412 345 678"}]

这是一个空的结果返回：

[{"senderMobile":""}]

这是调用 PHP 脚本并更新输入字段的 AJAX 代码：

$(document).ready(function() {
  $("#smsFromName").change(function() {
    var smsFromName = $("#smsFromName").val();
    console.log(smsFromName);
    $.post('getSMSSender.php', {
      senderName: smsFromName
    }, function(data) {
      data = JSON.parse(data);
      if (data.error) {
        alert("error");
        $("#smsFrom").html('');
        return; // stop executing this function any further
      } else {
        console.log(data[0].smsFrom);
        $("#smsFrom").val(data[0].senderMobile);
      }

    }).fail(function(xhr) {
      $("#smsFrom").html('');
    });
  });
});

我认为我需要更新此部分以包含一个选项，如果没有数据可以简单地清除 #smsFrom 输入字段：

} else { 
console.log( data[0].smsFrom );
$("#smsFrom").val(data[0].senderMobile);

但我现在被难住了。

【问题讨论】：

标签： javascript php jquery html ajax

【解决方案1】：

您只需要检查senderMobile 是否有值。试试这个：

if (data.error) {
    alert("error");
    $("#smsFrom").html('');
    return; // stop executing this function any further
} else if (data[0] && data[0].senderMobile) {
    console.log(data[0].smsFrom);
    $("#smsFrom").val(data[0].senderMobile);
} else {
    $("#smsFrom").val(""); // or .html(""); I didn't get what kind of element is this...
}

【讨论】：

【解决方案2】：

您可以尝试检查空字符串的响应数据。代码应如下所示：

$(document).ready(function() {
  $("#smsFromName").change(function() {
    var smsFromName = $("#smsFromName").val();
    console.log(smsFromName);
    $.post('getSMSSender.php', {
      senderName: smsFromName
    }, function(data) {
      data = JSON.parse(data);
      if (data.error) {
        alert("error");
        $("#smsFrom").html('');
        return; // stop executing this function any further
      } else {
        if(data[0].senderMobile == ""){
           $("#smsFrom").empty();
           continue;
        }else {
         console.log(data[0].smsFrom);
         $("#smsFrom").val(data[0].senderMobile);
         }
      }

    }).fail(function(xhr) {
      $("#smsFrom").html('');
    });
  });
});

【讨论】：