Question

我大家好，我有以下javascript函数，它应该检查表中列的索引。问题是columnName和表中的名称的比较。我已经使用columnName'ID'进行了测试，并且在表中找到了此列，但是比较不正确，因此不会返回索引。

我的代码：

function getColumnIndex(columnName, grid) {
    console.log("loading column index for column: [" + columnName + "]");
    $('div.hDivBox > table > thead > tr > th', grid).each(function(index) {
         var name = $(this).attr('title');
         console.log("Checking cell: [" + name + "]");
         if (String(name) == columnName) {
              return index;
         }
    });
    console.log("no cell found with name: " + columnName);
    return -1;
}

日志声明：

为列加载列索引：[ID]
  检查单元格：[ID]
  检查单元格：[名称]
  检查单元格：[说明]
  检查单元格：[AddTime]
  检查单元格：[UpdTime]
  没有找到名称为ID的单元格：ID

HTML的一个例子，由javascript函数分析：

<div class="hDivBox">
<table cellspacing="0" cellpadding="0">
    <thead>
        <tr>
            <th align="center" hidden="" axis="col0" title="ID" style="display: none;">
                <div style="text-align: center; width: 30px;">ID</div>
            </th>
            <th align="center" axis="col1" title="Name" class="">
                <div style="text-align: center; width: 250px;">Name</div>
            </th>
            <th align="center" axis="col2" title="Description" class="">
                <div style="text-align: center; width: 250px;">Beschreibung</div>
            </th>
            <th align="center" axis="col3" title="AddTime">
                <div style="text-align: center; width: 120px;">hinzugefügt</div>
            </th>
            <th align="center" axis="col4" title="UpdTime">
                <div style="text-align: center; width: 120px;">aktualisiert</div>
            </th>
        </tr>
    </thead>
</table>

Answer 1

传递给return jQuery函数的匿名函数中的.each()语句只返回那个函数，它也不会从getColumnIndex()返回功能

相反，我会做以下事情：

function getColumnIndex(columnName, grid) {
    console.log("loading column index for column: [" + columnName + "]");
    var index = -1;
    $('div.hDivBox > table > thead > tr > th', grid).each(function(i) {
        var name = $(this).attr('title');
        console.log("Checking cell: [" + name + "]");
        if (String(name) == columnName) {
            index = i;
            return;
        }
    });
    if(index == -1)
        console.log("no cell found with name: " + columnName);
    return index;
}

基本原则是，不是从匿名函数返回索引，而是简单地将正确的索引存储在其范围之外的变量中，因此您可以在.each()调用之后访问它已完成执行。

Answer 2

只需使用jQuery attribute selector来匹配标题，然后使用index()而不是自行循环。

function getIndexByTitle( title ) {
 return $('th[title="' + title + '"]').index();
}

alert(getIndexByTitle("ID"));
alert(getIndexByTitle("Name"));

Example

Answer 3

您正在使用.each()功能

.each(function(){
    ...
    return index;
});
return -1;

这将从回调中返回（如果index为false，则可能会停止每个循环），但永远不会突破并从外部getColumnIndex函数返回！所以，那个人总会返回-1。

快速修复：

function getColumnIndex(columnTitle, grid) {
    var index = -1;
    $('div.hDivBox > table > thead > tr:first > th', grid).each(function(i) {
        if ($(this).attr('title') == columnTitle) {
            index = i;
            return false; // break each-loop
        }
    });
    return index;
}

Answer 4

您正在从each迭代中调用的内部函数返回。您需要在每次调用之外保存索引以便以后访问它。

function getColumnIndex(columnName, grid) {
    var columnIndex;
    console.log("loading column index for column: [" + columnName + "]");
    $('div.hDivBox > table > thead > tr > th', grid).each(function(index) {
         var name = $(this).attr('title');
         console.log("Checking cell: [" + name + "]");
         if (String(name) == columnName) {
              columnIndex = index;
              // return false to exit the each iteration early
              return false;
         }
    });

    if (typeof columnIndex !== "undefined") {
        return columnIndex;
    };

    console.log("no cell found with name: " + columnName);
    return -1;
}

比较用jquery加载的字符串

4 个答案: