當表格單元格爲空時顯示警告框

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); 
}