1

当我有这样的功能时，如何获取被点击的元素的 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>

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

谢谢

4

4 回答 4

2

您使用.on().

该事件发生在input.select元素上，而不是#btnOneor #btnTwo。

如果您想要容器 (#btnOne或btnTwo) id 使用

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

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

于 2013-03-28T20:00:20.857 回答
2

this在您的代码中指的是input元素而不是#btnOne和#btnTwo元素，您可以使用delegateTarget事件对象的属性，它指的是事件委托的目标元素。

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

http://jsfiddle.net/WNC5y/

于 2013-03-28T20:03:50.453 回答
1

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

HTML

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

jQuery

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

经过测试并且可以工作......我确实需要将 div 点击选择器用引号括起来（呃！）

再次就我的评论而言，这种方法对于简单的 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）的后代（子）元素也被绑定。优点是在处理程序创建也被绑定之后创建并添加到事件处理程序的任何子项。它可能是节省时间的天赐之物。基本上，它允许快速将事件绑定到动态对象。试试看！

于 2013-03-28T20:00:30.783 回答
1

试试这个代码：

$("#btnOne, #btnTwo").click(function(){
    $(this).attr("id");
});
于 2013-03-28T20:03:01.227 回答