jQueryUI选项卡中的按钮单击问题

Question

我使用 jQueryUI 选项卡小部件作为休闲方式：

<div id="tabs">
    <ul>
        <li><a href="<%:Url.Action("List", new { statusId = 0, typeId = Model.TypeId }) %>">
            <span>X</span></a> </li>
        <li><a href="<%:Url.Action("List", new { statusId = 1, typeId = Model.TypeId }) %>">
            <span>Y</span></a> </li>
    </ul>
</div>

列表操作返回相同的视图，每个选项卡不同，返回的视图如下：

...
<form id="transactionList" method="post">
   <button type="button" id="approve">ok</button>
    <%: Html.Hidden("approveUrl", Url.Action("Approve"))%>
    <%: Html.Hidden("TransactionStatusId",Model.StatusId) %>    
<table>
    <tr>
...

标签加载后我在客户端绑定单击确定按钮：

 $("#tabs").tabs({load: tabLoaded});
  function tabLoaded(e, ui) {
        $("#approve").click(approve);
    }
  function approve(){
alert("something);
}

现在，当我将标签更改为第二个标签时，第二个标签的单击按钮不起作用，并且不会显示警报。

有什么想法吗？

Answer 1

如果每个视图都返回一个按钮，那么几个按钮的 id 会相同吗？

将视图中的 id="approve" 更改为 class="approve"，然后将 $("#approve") 更改为 $(".approve")。