Question

我是JavaScript的新手，我有以下问题。在JSP页面中我有这样的东西：

    <tbody>
        <c:forEach items="${listaProgetti.lista}" var="progetto" varStatus="itemProgetto">
            <tr id='<c:out value="${progetto.prgPro}" />'>
                <td><input type="checkbox" class="checkbox" onchange="changeCheckbox()"></td>
                .....................................................
                .....................................................
                .....................................................
            </tr>
        </c:forEach>
    </tbody>

所以你可以看到点击复选框，它叫做 changeCheckbox（）实际上非常简单：

function changeCheckbox() {
    alert("INTO changeCheckbox()");

    var checkedRowList = new Array();
}

问题是，在这个函数中，我必须检索触发更改事件的输入对象（我认为像这个）

如何获取之前 changeCheckbox（）功能中所点击复选框的引用？

Answer 1

该元素在事件处理程序内容属性中可用，而不在changeCheckbox中。但你可以将它作为论据传递。

使用this

changeCheckbox(this)

function changeCheckbox(elem) {
  elem.style.marginLeft = '100px';
}

<input type="checkbox" onchange="changeCheckbox(this)" />

使用event：

changeCheckbox(event.target)

function changeCheckbox(elem) {
  elem.style.marginLeft = '100px';
}

<input type="checkbox" onchange="changeCheckbox(event.target)" />

请注意，最好使用addEventListener：

document.querySelector('input').addEventListener('change', changeCheckbox);

然后函数changeCheckbox将接收事件对象作为其第一个参数，并将当前目标元素作为this值。

document.querySelector('input').addEventListener('change', changeCheckbox);
function changeCheckbox(e) {
  e.target.style.marginLeft = '100px';
}

<input type="checkbox" />

如何检索在JavaScript中触发事件的html对象的引用？

1 个答案: