0

我正在尝试通过 jquery 在表格上的 td 单元格上触发单击事件。我已经为不同表中的行实现了它，没有任何问题。作为参考，该表是一个月历，单击一个正方形将拉出当天的数据。

我无法触发该事件，因此我将代码简化为基础并将其放在自己的页面上，以确保没有任何干扰。css 中的表类是 table.calendar，代码如下：

 $('table.calendar').delegate('td','click',function () {
        alert('Success');
        var href = $(this).find("a").attr("href");
        if (href) {
            window.location = href;
        }
    });

我也将它作为 .calendar 尝试过，但没有成功。我已经确认该课程在桌子上是正确的，并且没有其他课程。我正在使用jquery 1.6.

知道为什么事件没有触发吗？

4

2 回答 2

1

尝试将您的代码包装在一个就绪回调中：

jQuery(function($) {
    $('table.calendar').delegate('td','click',function () {
            alert('Success');
            var href = $(this).find("a").attr("href");
            if (href) {
                window.location = href;
            }
        });
});

如果这不起作用，则很有可能您table.calender被异步添加。然后尝试：

$(document).deligate('table.calendar td', 'click', function() {
    alert("Success!");
});

或者

$("table.calendar td").live('click', function() {
    alert("Success!");
});

如果这不起作用，则您没有任何类calender包含任何td.

于 2012-06-30T14:02:18.007 回答
0

这是原始代码。请注意，我使用的是 VS2010，所以一些代码来自那里。

<form method="post" action="WebForm1.aspx" id="form1">
// 
<script type="text/javascript">



    jQuery(function ($) {

        $('table.calendar').delegate('td', 'click', function () {

            alert('Success');

            var href = $(this).find("a").attr("href");

            if (href) {

                window.location = href;

            }

        });

    });


<div>

<table id="tblCalendar" class="calendar" rules="all" border="1" style="width:70%;float:right;border-width:2px;border-color:Gray">

<tr style="border-width:2px;border-style:solid;">

    <th><a id="LinkBack" href="javascript:__doPostBack(&#39;LinkBack&#39;,&#39;&#39;)" style="font-size:Large;"><<</a></th><th align="center" colspan="1"><span id="CalendarTitle" style="font-size:Large;"></span></th><th align="center"><a id="LinkForward" href="javascript:__doPostBack(&#39;LinkForward&#39;,&#39;&#39;)" style="font-size:Large;">>></a></th>

</tr><tr>

    <td class="Regular">3</td><td>4</td><td>5</td>

</tr>


</div>

</form>

于 2012-06-30T14:34:14.747 回答