Question

我正在编写一个脚本，其中原始开发人员可能添加了event.preventDefault（）或某些如何阻止对某些表td元素的任何进一步点击。他们的点击产生了一个Ajax请求，我可以在浏览器控制台中看到，但我的新onClick处理程序从未执行过。我想添加另一个onclick处理程序，我在其中显示一个模态弹出窗口。显示模态很容易我只是不确定他们是如何停止在元素上添加进一步的onclick处理。

我实际上已经使用以下代码测试代码，看看会发生什么，我看到的比我收到警报;

Event.prototype.stopPropagation = function(){ alert('stopPropagation') }
Event.prototype.preventDefault = function(e){ console.log (e); alert('preventDefault') }

所以我在想event.preventDefault()正在被使用。如果阻止了进一步的点击，我如何强制我的代码在点击事件上执行。这是我的代码;

(function (){
    Event.prototype.stopPropagation = function(){ alert('stopPropagation') }
    Event.prototype.preventDefault = function(e){ console.log (e); alert('preventDefault') }
    jQuery('body').on('click', 'td.bookable', function (e){
       console.log ("Clickable!"); //This is not logged.
        //I want to add my show modal popup here.
    });
})();

表格如下;

<table class="ui-datepicker-calendar">
   <thead>
      <tr>
         <th scope="col"><span title="Monday">M</span></th>
         <th scope="col"><span title="Tuesday">T</span></th>
         <th scope="col"><span title="Wednesday">W</span></th>
         <th scope="col"><span title="Thursday">T</span></th>
         <th scope="col"><span title="Friday">F</span></th>
         <th scope="col" class="ui-datepicker-week-end"><span title="Saturday">S</span></th>
         <th scope="col" class="ui-datepicker-week-end"><span title="Sunday">S</span></th>
      </tr>
   </thead>
   <tbody>
      ...
      <tr>
         <td class=" ui-datepicker-unselectable ui-state-disabled bookable" title="This date is available"><span class="ui-state-default">9</span></td>
         <td class=" ui-datepicker-unselectable ui-state-disabled not_bookable" title="This date is unavailable"><span class="ui-state-default">10</span></td>
         <td class=" ui-datepicker-unselectable ui-state-disabled not_bookable" title="This date is unavailable"><span class="ui-state-default">11</span></td>
         <td class=" ui-datepicker-unselectable ui-state-disabled not_bookable" title="This date is unavailable"><span class="ui-state-default">12</span></td>
         <td class=" ui-datepicker-unselectable ui-state-disabled not_bookable" title="This date is unavailable"><span class="ui-state-default">13</span></td>
         <td class=" ui-datepicker-week-end ui-datepicker-unselectable ui-state-disabled not_bookable" title="This date is unavailable"><span class="ui-state-default">14</span></td>
         <td class=" ui-datepicker-week-end ui-datepicker-unselectable ui-state-disabled not_bookable" title="This date is unavailable"><span class="ui-state-default">15</span></td>
      </tr>
      <tr>
         <td class=" ui-datepicker-unselectable ui-state-disabled not_bookable" title="This date is unavailable"><span class="ui-state-default">16</span></td>
         <td class=" ui-datepicker-unselectable ui-state-disabled bookable ui-datepicker-today" title="This date is available"><span class="ui-state-default">17</span></td>
         <td class=" ui-datepicker-unselectable ui-state-disabled bookable" title="This date is available"><span class="ui-state-default">18</span></td>
         <td class=" bookable" title="This date is available" data-handler="selectDay" data-event="click" data-month="9" data-year="2017"><a class="ui-state-default" href="#">19</a></td>
         <td class=" bookable" title="This date is available" data-handler="selectDay" data-event="click" data-month="9" data-year="2017"><a class="ui-state-default" href="#">20</a></td>
         <td class=" ui-datepicker-week-end bookable" title="This date is available" data-handler="selectDay" data-event="click" data-month="9" data-year="2017"><a class="ui-state-default" href="#">21</a></td>
         <td class=" ui-datepicker-week-end bookable" title="This date is available" data-handler="selectDay" data-event="click" data-month="9" data-year="2017"><a class="ui-state-default" href="#">22</a></td>
      </tr>
      ...
   </tbody>
</table>

对于有19的td，当我添加onClick回调时，它不起作用。我特别无法使用not_bookable类绑定onclick到元素。

Answer 1

如果您无法删除原来的preventDefault，我不确定您是否能够实现此目的。那么使用另一个事件，比如mousedown？我不理想，但是......

进一步的onClick被阻止导致新的onclick无法工作覆盖event.preventDefault（）

1 个答案: