Question

当我有这样的函数时，如何获取被点击的元素的id？

$("#btnOne, #btnTwo").on("click", "input.select", function () {

我试过了：

this.id;

和

$(this).attr("id");

这是html

<div id="TransferOwnershipBox" title="Transfer Ownership">
    <table>
        <tr>
            <td>
                <asp:TextBox ID="tbSearchField" Text="Search..." ClientIDMode="Static" Width="400px" runat="server" CssClass="text ui-widget-content ui-corner-all"></asp:TextBox>
            </td>
            <td>
                <input type="button" id="btnSearch" data-str="tblOwnerSearchResults" value="Search" Class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only" />
            </td>
        </tr>
    </table>
    <table id="tblOwnerSearchResults" data-str="ownerId" data-dataItem="id" style="border: none; width: 100%; padding: 2px;"></table>
</div>


<!-----COURSE DIRECTOR----->
<div id="CourseDirectorBox" title="Directors">
    <table>
        <tr>
            <td>
                <asp:TextBox ID="tbDirector" Text="Search..." ClientIDMode="Static" Width="400px" runat="server" CssClass="text ui-widget-content ui-corner-all"></asp:TextBox>
            </td>
            <td>
                <input type="button" id="btnDirectorSearch" data-str="tblDirectorSearchResults" value="Search" Class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only" />
            </td>
        </tr>
    </table>
    <table id="tblDirectorSearchResults" data-str="source" data-dataItem="DisplayName" style="border: none; width: 100%; padding: 2px;"></table>              
</div>

但我也没有得到任何身份证明。

由于

Answer 1

您使用.on()。

的委托语法

事件发生在input.select元素而不是#btnOne或#btnTwo。

如果您想要容器（ #btnOne或btnTwo ）id，请使用

$("#btnOne, #btnTwo").on("click", "input.select", function () {  
   var id = $(this).closest('#btnOne, #btnTwo')[0].id;
});

如果您使用的是1.7及更高版本（，您应该），请使用@undefined's answer

Answer 2

代码中的

this引用input元素而非#btnOne和#btnTwo元素，您可以使用引用的事件对象的delegateTarget属性事件委托的目标元素。

$("#btnOne, #btnTwo").on("click", "input.select", function(event) {
    console.log(event.delegateTarget.id);
});

http://jsfiddle.net/WNC5y/

Answer 3

由于我无法看到您的HTML，我将提供一个示例：

HTML

<div id="ID1">Hello World</div>

的jQuery

$(document).ready(function() {
    $("div").click(function() {
        var id = $(this).attr("id");
        alert(id);
    });
});

经过测试和工作......我确实需要将div单击选择器包装在引号（duh！）

中

再次就我的评论而言，这种方法对于简单的jQuery onClick事件来说可能是最干净的。如果你必须对jQuery使用.on（）绑定方法，它就非常相似。

代表

为了使用click事件绑定的.on（）委托方法，语法（正如你的问题所示）看起来像这样：

HTML

<div id="myTable">
    <div class="table-row" id="a">Hello World</div>
    <div class="table-row" id="b">I'm a delegate!</div>
</div>

的jQuery

$(document).ready(function() {
    $("#myTable").on("click", "div", function() {
        var id = $(this).attr("id");
        alert(id);
    });
});

这种事件绑定方式允许绑定父事件处理程序（在我们的例子中是#myTable）的后代（子元素）的任何元素。优点是在处理程序创建之后也创建并添加到事件处理程序的任何子项。它可能是节省时间的天赐之物。基本上，它允许快速将事件绑定到动态对象。试试吧！

Answer 4

试试这段代码：

$("#btnOne, #btnTwo").click(function(){
    $(this).attr("id");
});

获取被单击的元素的id

4 个答案:

代表