Javascript 默认设置不起作用

我试图在单击链接时发送ajax请求以完成任务。由于某种原因，

e.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);
                    }
                });
            });
        }
    });
});

$（函数（）{
$（'.ajax任务完成'）。在({
点击：功能（e）{
e、 停止传播（）；
e、 预防默认值（）；
var href=$（this.attr（'href'）；
$（''）.load（href+'form'，function（）{
//定形
var form=$（this.children（'form'）；
//设置复选框
var cb=form.find（'input[type=“checkbox”]”）；
//标记复选框
cb.prop（'checked'），！cb.prop（'checked'）；
//表单操作URL
var url=form.attr（'action'）；
//设置数据
var data=form.serialize（）；
$.ajax({
url:url，
数据：数据，
方法：“post”，
数据类型：“json”，
cache:false，
成功：功能（obj）{
var tic=$（“#任务完成-”+obj.id+“.ajax任务完成”）；
},
完成：函数（）{
console.log（'complete'）；
},
错误：函数（err）{
控制台日志（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>

{%if entity.completed%}
{%else%}
{%endif%}

根据单击事件发生的位置，您可能需要停止冒泡。尝试添加这个，看看会发生什么

e.stopPropagation();

---

您的作用域错误，在

（函数）（

之后缺少

（）

。永远不会调用该函数：

(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

在

（函数（）{

javascript页面加载事件应该类似于

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

或 函数将由自己调用

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

或

您可以检查小提琴

这是您的问题：

未捕获引用错误：$未定义

---

阅读如何正确加载jQuery插件。

尝试将preventDefault事件放置在函数末尾，如下所示

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

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

---

我不能测试它是否工作，因为我在Mobile上。

为什么你不只是附加点击事件？如果你有一些标准你正在评估，因此运行预防默认，那么也许考虑从这个函数返回。为什么你在你的函数中已经使用Ajax时使用负载？可能是H。由于加载而出现您的e.preventDefault（）无法正常工作？您能否显示按钮

ajax任务完成

@在那里学习您会认为您加载jQuery的方式不正确：不幸的是，它仍然将我带到页面。您是否同时使用e.preventDefault（）；&e.stopPropagation（）进行了尝试；是的，它们都在那里，我会刷新上面的代码来显示。嗯，你可以试试e.stopImmediatePropagation（）事实上，很难从你的问题中准确判断到底发生了什么。你能创建一个plunkr或JSFIDLE来重现这个bug吗？Gagnon我尝试了你所说的。它一直告诉我

未捕获引用错误：$未定义

@zachstarnes，那么你在加载jquery时遇到了问题。可能它没有加载或存在冲突。请尝试

>（函数（$）{…}）（jQuery）

。如果出现类似jQuery未定义的错误，则表示未加载。至少出现错误意味着它运行代码，这是向前迈出的一步！我得到了这个

未捕获引用错误：$未定义

请检查小提琴。

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

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

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

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