ajax附加块中的if语句

if statement in ajax append block

本文关键字：if 语句 ajax      更新时间：2023-09-26

我有一个ajax块，它正在处理来自外部API的json响应。我有一个名为status的对象字段，根据状态，我希望显示相应的工具提示。目前，我正在尝试使用if语句来完成此操作，但我遇到了一个错误。

错误为：

Uncaught SyntaxError: Unexpected token if

Ajax块

<script type="text/javascript">
  $.ajax({
    url: "pull_overview",
    dataType: "json",
    cache: false,
      success: function(data){
        if ( data == null ) {
          $('#ajax-loader').hide()
          $('#overviewlist tbody').append("<tr><td colspan='100'><h3><center>You have no recent transactions.</center></h3></td></tr>");
        } 
        else {
          $('#ajax-loader').hide()
          $.each(data, function(index, element) {
            $('#overviewlist tbody').append("<tr><td>"    + element.name + "</td><td>" 
                                                          + element.time + "</td><td>" 
                                                          + element.type + "</td><td>"
                                                          + element.change_in_balance + "</td><td>"
                                                          + element.method + "</td><td>"
                                                          + 
                                                          if (element.status == 'New Transaction') {
                                                            "<td><button type='button' class='tooltips btn-u btn-u-xs btn-u-purple' data-toggle='tooltip' data-placement='right' title='Your transaction is currently being processed'>Pending</button></td></tr>"
                                                          } 
          });
        }
    }
  });
</script>

正如错误所说，您有一个SyntaxError。固定代码为：

$.ajax({
    url: "pull_overview",
    dataType: "json",
    cache: false,
    success: function (data) {
        if (data == null) {
            $('#ajax-loader').hide()
            $('#overviewlist tbody').append("<tr><td colspan='100'><h3><center>You have no recent transactions.</center></h3></td></tr>");
        } else {
            $('#ajax-loader').hide()
            $.each(data, function (index, element) {
                $('#overviewlist tbody').append("<tr><td>" + element.name + "</td><td>" + element.time + "</td><td>" + element.type + "</td><td>" + element.change_in_balance + "</td><td>" + element.method + "</td><td>" + element.status == 'New Transaction' ?
                    "<td><button type='button' class='tooltips btn-u btn-u-xs btn-u-purple' data-toggle='tooltip' data-placement='right' title='Your transaction is currently being processed'>Pending</button></td></tr>" : "");
            });
        }
    }
});

有什么变化？

  • 缺少一些括号
  • 不能在字符串（例如"foo" + if(something) "bar"）中包含if语句。改为使用三元运算符："foo" + something ? "bar" : ""

有用资源：

  • 带有Javascript三元运算符的运算符优先级
  • 如何查找Javascript语法错误
  • 如何使用？：JavaScript中的（条件）运算符

在上一个append调用中，不能将if语句放在字符串连接的中间。改为

content = "<tr><td>" + element.name + "</td><td>" 
          + element.time + "</td><td>" 
          + element.type + "</td><td>"
          + element.change_in_balance + "</td><td>"
          + element.method + "</td><td>";
if (element.status == 'New Transaction')
    content += "<td><button type='button' class='tooltips btn-u btn-u-xs btn-u-purple' data-toggle='tooltip' data-placement='right' title='Your transaction is currently being processed'>Pending</button></td></tr>";
$('#overviewlist tbody').append(content);
相关文章：