Question

下面是渲染的Datalist。似乎 $（'＃ctl00_ContentPlaceHolder1_ShowListing_DataList1 $ 3 $ 0 $ inquire'）。click（function（）{...} 不起作用，因为当我点击其中一个按钮（在DataList上）时是为了触发这个功能，没有任何反应。

如何使用JQuery按ID查找按钮？因此，如果单击DataList上的任何按钮，基本上应该触发该函数。

谢谢。

    <table id="ctl00_ContentPlaceHolder1_ShowListing_DataList1" class="DataWebControlStyle"
        style="visibility: visible;">
        <tbody>
            <tr>
                <td class="RowStyle">
                    <div class="ListItemContainer">
                        <div class="EnquireButton">
                            <a class="activator" id="ctl00_ContentPlaceHolder1_ShowListing_DataList1$3$1$enquire">
                            </a>
                        </div>
                    </div>
                </td>
            </tr>
            <tr>
                <td class="RowStyle">
                    <div class="ListItemContainer">
                        <div class="EnquireButton">
                            <a class="activator" id="ctl00_ContentPlaceHolder1_ShowListing_DataList1$3$1$enquire">
                            </a>
                        </div>
                    </div>
                </td>
            </tr>
        </tbody>
    </table>

    <script type="text/javascript">
        $(function() {
            $('#ctl00_ContentPlaceHolder1_ShowListing_DataList1$3$0$enquire').click(function() {
                $('#enquireOverlay').fadeIn('fast', function() {
                    $('#box').animate({ 'top': '160px' }, 500);
                });
            });
            $('#boxclose').click(function() {
                $('#box').animate({ 'top': '-200px' }, 500, function() {
                    $('#enquireOverlay').fadeOut('fast');
                });
            });
        });
    </script>

Answer 1

只是不要使用ID，请使用他们已经拥有的class：

$('a.activator').click(function() {
    $('#enquireOverlay').fadeIn('fast', function() {
        $('#box').animate({ 'top': '160px' }, 500);
    });
});

或者更好.delegate()：

$(".DataWebControlStyle").delegate(".activator", "click", function() {
    $('#enquireOverlay').fadeIn('fast', function() {
        $('#box').animate({ 'top': '160px' }, 500);
    });
});

这些方法中的任何一种都会使您的代码变得简单，并允许您将其移动到用户的外部可缓存文件中。

Answer 2

你应该使用直播。

  $("#boxclose").live("click", function() {
                    $('#box').animate({ 'top': '-200px' }, 500, function() {
                        $('#enquireOverlay').fadeOut('fast');
                    });
                });

无法通过ID与JQuery在Datalist中找到元素

2 个答案: