Question

我目前在我的应用程序中对表格的每一列都有一个排序按钮，当我单击一个排序按钮时，我希望将该按钮的ID传递到函数中，以便对正确的列进行排序。在我的HTML中，我只是有一个这样的表...

<table id="table"></table>

然后，我有一些函数用数据库中所有需要的行填充表。对于创建标题行的函数，它还将在该行中每个单元格的末尾附加一个排序按钮。我通过以下方法创建排序按钮...

const createSortBtn = item => {
    let btn = document.createElement("button");
    btn.innerHTML = '&#9660;';
    btn.id = item;
    btn.addEventListener("click", sortTable);
    return btn;
}

变量项是我希望提供要创建的按钮的ID，innerHTML只是一个向下的三角形，然后我还添加了onclick函数。这样的onclick功能就这样...

const sortTable = () => {
    let order, index = this.id;
    if (document.getElementById(index).innerHTML === '&#9660;') order = "ASC";
    else order = "DESC";
    window.sessionStorage.setItem("order", order);
    window.sessionStorage.setItem("index", index);
    makeSearch();
}

除this.id部分外，大多数功能与我的问题不太相关。到目前为止，从我所能发现的情况来看，这似乎是获取onclick按钮ID的主要方法（即使在我认为是正确的严格模式下也是如此）。但是，在函数中调用它时，它是不确定的。

我一直在想，也许我可以更改代码，当我在排序按钮上添加onclick函数时，它会像这样...

const createSortBtn = item => {
    let btn = document.createElement("button");
    btn.innerHTML = '&#9660;';
    btn.id = item;
    btn.addEventListener("click", sortTable(item));
    return btn;
}

...但是这似乎立即调用了函数，这不是我希望的行为。

我已经看到jQuery似乎有很多方法可以做到这一点，但是我希望尽可能使用本机JavaScript。感谢所有帮助。

从onclick函数获取按钮的ID

0 个答案: