Question

其他编码员，以下是我正在研究的结构的片段。我有一个项目列表（列表），其中包含一堆项目，每个项目由包装器标识，其id具有该项目唯一的值（id =“123”）。每个项目都有一堆后代元素，其中一个包含一些动作按钮。

<div id="the-list">

    <div id="123" class="an-item">
        <div></div>
        <div></div>
        <div id="footer">
            <div id="something"></div>
            <div id="actions">
                <botton id="action-email">email</button>
                <botton id="action-edit">edit</button>
            </div>
        </div>
    </div>

    <div id="124" class="an-item">
        <div></div>
        <div></div>
        <div id="footer">
            <div id="something"></div>
            <div id="actions">
                <botton id="action-email">email</button>
                <botton id="action-edit">edit</button>
            </div>
        </div>

    </div>  

</div>

我正在处理列表（列表）级别的冒泡鼠标点击，这似乎正在起作用。我的问题是能够识别哪个项目的按钮被点击了。因此，当单击其中一个电子邮件操作按钮时，我需要知道它是属于项目123还是项目124的那个。

有没有办法通过jQuery或更好的设计模式获取父ID号？

感谢

Answer 1

您可能不会两次使用相同的ID！

为您的按钮提供单独的ID - 在这种情况下，您只需使用ID来标识按钮或类。在这种情况下，您可以使用此代码获取父级;假设this是按钮：$(this).closest('.an-item').attr('id')

演示：http://jsfiddle.net/ThiefMaster/SvBR2/

Answer 2

首先，您在示例代码中拼错了“按钮”。你应该解决这个问题。：）

其次，正如ThiefMaster所说，你必须给按钮提供唯一的ID。两个元素可以具有相同的name属性，但不具有相同的id属性。这适用于所有元素。如果没有必要拥有唯一的ID，你可能想给他们上课。

然后，一旦你做完了。使用列表级别的点击事件，您可以获得所点击按钮的ID，如下所示：

$(function() {
    $('#the-list').click(function(evt) {
        var elemid = $(evt.target).attr('id');
        if (/action-/.test(elemid)) {
            alert('this is an action! Element ID: ' + elemid);
        }
    });
});

这也测试通过对id进行正则表达式检查来确保按下按钮，以确保其中有“action-”。这只是确保您没有点击其他元素而不是按钮。

您可以在行动here中看到这一点。

跟踪父母

2 个答案: