Question

我有一张表，每行包含2张图片。单击任一图像时，我需要对该行执行操作。但是，当我单击图像时，只有顶行有效。我知道它，因为所有图像都具有我在click事件中使用的相同ID名称，但是如果我给它们唯一ID，我该如何写一个onclick来捕获它们？

jQuery(document).ready(function()
{
    jQuery("#UpClick").click(function()
    {
        alert("AS debug up");
    });
    jQuery("#DownClick").click(function()
    {
        alert("AS debug down");
    });
}); 


<form id="frm" action="AccountList.asp" method="post">
    <table id="sortList" class="pagetext">
        <tr glid="1008298">
            <td>
                <a href="#" id="DownClick"><img src="/images/report_desc2.gif"></a>
                <a href="#" id="UpClick"><img src="/images/report_asc2.gif"></a>
            </td>
            <td>
                <input type="checkbox" name="chkCopy" class="chkCopy" value="1008298">Test account (Accrual)
            </td>
        </tr>
        <tr glid="1008299">
            <td>
                <a href="#" id="DownClick"><img src="/images/report_desc2.gif"></a>
                <a href="#" id="UpClick"><img src="/images/report_asc2.gif"></a>
            </td>
            <td>
                <input type="checkbox" name="chkCopy" class="chkCopy" value="1008298">Test account (Vac)
            </td>
        </tr>
        <tr glid="1008300">
            <td>
                <a href="#" id="DownClick"><img src="/images/report_desc2.gif"></a>
                <a href="#" id="UpClick"><img src="/images/report_asc2.gif"></a>
            </td>
            <td>
                <input type="checkbox" name="chkCopy" class="chkCopy" value="1008298">Test account (PTO)
            </td>
        </tr>
    </table>
</form>

Answer 1

那是因为你给多个元素提供相同的ID。这是非法的，当您使用jQuery("#UpClick")时，jQuery找不到多个元素。

为此使用一个类，以便您可以使用

进行绑定

jQuery(".UpClick").click(function() {
    console.log("AS debug up"); // yes, it's much easier to use the console than alert
});

Answer 2

试试这个：

<强> HTML

<a href="#" class="DownClick">....
<a href="#" class="UpClick">....

<强> SCRIPT

jQuery(document).ready(function()
{
    jQuery(".UpClick").click(function(e)
    {
        e.preventDefault();
        alert("AS debug up");
    });
    jQuery(".DownClick").click(function(e)
    {
        e.preventDefault();
        alert("AS debug down");
    });
});

Answer 3

不是为图像使用ID，而是为它们分配一个类。

<a href="#" class="DownClick">

您可以根据类别找到元素：$(".DownClick")

确定一个孩子

3 个答案: