進一步onClick被阻止導致新的onclick不工作|覆蓋event.preventDefault（）

我正在處理原始開發人員可能已添加event.preventDefault（）或一些如何阻止任何進一步點擊某些表td元素的腳本。他們的點擊產生了一個Ajax請求，我可以在瀏覽器控制檯中看到，但是我的新的onClick處理程序從不執行。我喜歡添加另一個onclick處理程序，在其中顯示模式彈出窗口。顯示模式很簡單我只是不確定他們是如何停止在元素上添加進一步的onclick處理的。進一步onClick被阻止導致新的onclick不工作|覆蓋event.preventDefault（）

我已經用下面的代碼實際測試了代碼，看看發生了什麼，我可以看到比我看到的警報;

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回調時它不起作用。我特別不能將onclick綁定到類爲not_bookable的元素。

來源

2017-10-17 LogicDev

所以叫你onmousedown。刪除preventDefault是一個壞主意。 – epascarello

謝謝你是一個不錯的選擇。我想知道是否有其他方法可以實際克服預防進一步的點擊。 – LogicDev

我不確定如果無法刪除原始的preventDefault，您將能夠實現此目的。如何使用另一個事件，如mousedown？我不是很理想，但...

來源

2017-10-17 21:06:40

進一步onClick被阻止導致新的onclick不工作|覆蓋event.preventDefault（）

回答

相關問題