javascript - 表格单元格为空时显示警告框

Question

我试图在 <td> 时显示警报框是空的。我的代码如下:

HTML

<table id="results">
  <Full name: <br>
    <input id="userInput" type="text" name="fullname">
    <br>
    <input id="submit" type="submit" value="Submit">
</table>

脚本

var table = $("#results");

// get the sparql variables from the 'head' of the data.
var headerVars = data.head.vars;

// using the vars, make some table headers and add them to the table;
var trHeaders = getTableHeaders(headerVars);
table.append(trHeaders);

// grab the actual results from the data.
var bindings = data.results.bindings;

// for each result, make a table row and add it to the table.
for (rowIdx in bindings) {
  table.append(getTableRow(headerVars, bindings[rowIdx]));
}

function getTableRow(headerVars, rowData) {
  var tr = $("<tr></tr>");

  for (var i in headerVars) {
    tr.append(getTableCell(headerVars[i], rowData));
  }

  return tr;
}

function getTableCell(fieldName, rowData) {

                    var td = $("<td></td>");
                    var fieldData = rowData[fieldName];

                    if ($('td').html().trim() == "") {
                        alert("td is empty");
                    }
                    else {
                        alert("fieldName = [" + fieldName + "] rowData[fieldName][value] = [" + rowData[fieldName]["value"] + "]");
                        td.html(fieldData["value"]);
                        return td;
                    }
                    console.log(td);


                }

function getTableHeaders(headerVars) {
  var trHeaders = $("<tr></tr>");
  for (var i in headerVars) {
    trHeaders.append($("<th>" + headerVars[i] + "</th>"));
  }
  return trHeaders;
}

现在没有弹出警告框，那么如何在 <td> 时显示警告框归档为空？

Answer 1

当我们这样做时$("<td></td>") ，jQuery 创建一个 td 元素并返回它，因此您的条件 td == 0 ，将始终为 false，因此您看不到警报。

要在 html 页面上选择 td，我们需要使用 $('td') ，并检查元素是否为空，使用 .html() jQuery 的功能。

因此类似，

if($('td').html().trim() === ''){
   alert('td is empty')
}

希望这有帮助。

根据您的情况尝试一下:

function getTableCell(fieldName, rowData) {
  var td = $("<td></td>");
  var fieldData = rowData[fieldName];
  alert("fieldName = [" + fieldName + "] rowData[fieldName][value] = [" + rowData[fieldName]["value"] + "]");

  //You need to check id fieldData["value"] is empty and then trigger alert, as if this empty your td will be empty
  if (fieldData["value"] && fieldData["value"].trim().length !== 0) {
    td.html(fieldData["value"]);
    return td;
  } else {
    alert("td is empty");
  }
  console.log(td);
}