动态更改更新面板内项目的样式

Change style of an item inside updatepanel dynamically

我在更新面板中有一张图片。当我单击图像时,它需要突出显示。如果它在 updatepanel 之外,我使用 addclass 和 removeclass 来完成这项工作。当我将图像放入更新面板时,应用 css 但在更新完成并呈现页面后恢复为原始状态。

如何动态更改更新面板中图像的样式?

标记:

<asp:UpdatePanel ID="UpdatePanel2" runat="server" class="journey-categories">
                        <ContentTemplate>
                            <ul class="journey-categories">
                                <asp:Repeater ID="rptJourneyCategories" runat="server">
                                    <ItemTemplate>
                                        <li>
                                            <a href="javascript:void(0)" data-categoryid="<%# Eval("Id") %>" data-introtitle="<%# Eval("IntroTitle") %>" data-introtext="<%# Eval("IntroText") %>">
                                                <img class="thumb" src="<%# Eval("CategoryIcon") %>" width="70" height="70" alt="" id="imgCategoryIcon" />
                                            </a>
                                            <span><%# Eval("Title") %></span>
                                        </li>
                                    </ItemTemplate>
                                </asp:Repeater>
                            </ul>
                        </ContentTemplate>
                    </asp:UpdatePanel>

Jquery:

$('[data-categoryid]').off('click.categories').on('click.categories', function () {
                   $(this).closest('ul').find('li.selected').removeClass('selected');
                    $(this).parent().addClass('selected');
                });

我在 EndRequestHandler

的帮助下完成了这项工作

我在准备好的内部脚本文件中添加了以下内容,并在更新面板完成后更新了样式。

<script type="text/javascript">
        $(function () {
            var onDomReady = function () {
                Sys.WebForms.PageRequestManager.getInstance().add_endRequest(EndRequestHandler);
function EndRequestHandler() {
                    var type = $('[id$=ddlType]').val();
                    $('a[data-categoryid="' + type + '"').parent().addClass('selected');
                }
}});