preventDefault不起作用

我試圖發送一個ajax請求來完成一個任務，當一個鏈接被點擊時。由於某些原因，e.preventDefault無法正常工作，我仍然被髮送到該頁面。有什麼我失蹤？preventDefault不起作用

它只是應該去頁面設置複選框檢查（或未選中），然後重定向。但是它只是進入頁面。任何幫助將是偉大的！

這裏是main.js

$(function() { 

    $('.ajax-task-complete').on({ 
     click: function(e) { 
      e.stopPropagation(); 
      e.preventDefault(); 

      var href = $(this).attr('href'); 

      $('<div></div>').load(href+' form', function() { 

       // Set Form 
       var form = $(this).children('form'); 

       // Set Checkbox 
       var cb = form.find('input[type="checkbox"]'); 

       // Taggle Checkbox 
       cb.prop('checked', !cb.prop('checked')); 

       // Form Action URL 
       var url = form.attr('action'); 

       // Set Data 
       var data = form.serialize(); 

       $.ajax({ 
        url: url, 
        data: data, 
        method: 'post', 
        dataType: 'json', 
        cache: false, 
        success: function(obj) { 
         var tic = $('#task-complete-' + obj.id + ' .ajax-task-complete'); 
        }, 
        complete: function() { 
         console.log('complete'); 
        }, 
        error: function(err) { 
         console.log(err); 
        } 
       }); 
      }); 
     } 
    }); 
});

這裏請求按鈕

<td id="task-complete-{{ entity.id }}"> 
{% if entity.completed %} 
    <a class="check ajax-task-complete" href="{{ path('task_edit_complete', { 'id': entity.id }) }}">&#10004;</a> 
{% else %} 
    <a class="uncheck ajax-task-complete" href="{{ path('task_edit_complete', { 'id': entity.id }) }}">&#10004;</a> 
{% endif %} 
</td>

來源

2014-01-08 zachstarnes

爲什麼不'你只是不附加點擊事件？如果你有一些標準你正在評估，並因此運行preventDefault，那麼現在可能考慮從函數返回？ –

爲什麼在你的函數中已經使用ajax的時候使用了load？這可能是因爲你的e.preventDefault（）工作不正常而發生的。 –

你可以顯示按鈕'ajax任務完成' –

這是你的問題：

Uncaught ReferenceError: $ is not defined?

閱讀HERE from SO你如何加載jQuery的插件的正確途徑。

來源

2014-01-08 21:22:04 aldanux

可能需要不同的地方單擊事件發生停止冒泡。嘗試添加，看看會發生什麼。

e.stopPropagation();

來源

2014-01-08 20:53:41 NSjonas

。 – zachstarnes

你是否試過e.preventDefault（）; ＆e.stopPropagation（）; – NSjonas

是的，我做了他們都在那裏我會刷新上面的代碼來顯示它。 – zachstarnes

你的範圍是錯的，你缺少(function)()後()。該功能從未被稱爲：

(function() { 

    $('.ajax-task-complete').on({ 
     click: function(e) { 
      e.stopPropagation(); 
      e.preventDefault(); 

      var href = $(this).attr('href'); 

      $('<div></div>').load(href+' form', function() { 

       // Set Form 
       var form = $(this).children('form'); 

       // Set Checkbox 
       var cb = form.find('input[type="checkbox"]'); 

       // Taggle Checkbox 
       cb.prop('checked', !cb.prop('checked')); 

       // Form Action URL 
       var url = form.attr('action'); 

       // Set Data 
       var data = form.serialize(); 

       $.ajax({ 
        url: url, 
        data: data, 
        method: 'post', 
        dataType: 'json', 
        cache: false, 
        success: function(obj) { 
         var tic = $('#task-complete-' + obj.id + ' .ajax-task-complete'); 
        }, 
        complete: function() { 
         console.log('complete'); 
        }, 
        error: function(err) { 
         console.log(err); 
        } 
       }); 
      }); 
     } 
    }); 
})(); //Add() here

但是在這裏真的需要的範圍？

也許你的意思是一個現成的處理程序，那麼就應該是這樣的：

$(function); //Missing '$'

來源

2014-01-08 21:05:42

Gagnon我試過你說的話，它總是告訴我'Uncaught ReferenceError：$沒有定義' – zachstarnes

@zachstarnes然後你在加載jquery時出現問題（函數（$）{...}）（jQuery）'。給出一個錯誤，如jQuery沒有定義，這意味着它沒有加載。 –

Atleast有一個錯誤的意思它運行你的代碼，這是一步！ –

**"$"**

前(function() {

缺少的JavaScript頁面加載事件應該像

$(function(){ 
//code here 
});

或函數將自己調用

(function(){ 
     //code here 
     )}();

或

(function($){ 
//code here 
})(jQuery)

您可以檢查小提琴here

來源

2014-01-08 21:13:07

我得到這個'未捕獲ReferenceError：$未定義' – zachstarnes

請檢查小提琴。 –

你能告訴我們你是如何加載你的jQuery文件？ –

嘗試放置的preventDefault事件在函數的末尾，如下

$('.ajax-task-complete').on({ 
    click: function(e) { 
    // 
    //your code here then, 

e.preventDefault(); 
e.stopPropragation(); 
});

，我無法測試是否有用，或者還不如我上移動。

來源

2014-01-08 21:26:22 Joberror

preventDefault不起作用

回答

相關問題