点击按钮后函数无法运行，附jQuery代码求助

嘿，我一眼就揪出问题所在了——你在绑定事件处理函数的时候犯了个典型的小失误，这也是不少刚接触jQuery的开发者容易踩的坑！

核心问题：错误地立即执行了函数 #

当你写：

$("#remove").on("click", toggleRemove());
$(".front").on("load", init());

这里的toggleRemove()和init()是立即调用函数，JavaScript会马上执行它们，然后把它们的返回值（这里都是undefined）传给.on()方法作为事件处理程序。这就导致点击按钮时，根本没有绑定到你想要的函数上，自然不会触发预期的逻辑。

正确的做法是传递函数本身的引用，也就是去掉后面的括号：

$("#remove").on("click", toggleRemove);
$(".front").on("load", init);

修正后的完整代码 #

$(function () {
    var podatoci;
    var i;

    // 去掉括号，传递函数引用
    $(".front").on("load", init);
    $("#remove").on("click", toggleRemove);

    function init() {
        load();
    }

    function load() {
        $.get("data.json", function (data, status) {
            podatoci = data;
            fill();
        })
    }

    function toggleRemove() {
        console.log("Yes");
        $(".likse-dislikes").toggle();
    }

    function fill() {
        for (i = 0; i < podatoci.length; i++) {
            $("#container").append("<div class='wrap'><img class='img' src='" + podatoci[i].url + "'/></div>");
            // 注意：你原代码末尾的HTML字符串有语法错误，这里帮你补全了闭合标签
        }
    }
});

额外注意事项 #

1. 如果.front是图片元素，要确保绑定load事件的时候图片还没加载完成，否则load事件可能不会触发。你可以考虑把图片的src属性放在绑定事件之后设置，或者用$(window).on("load", ...)来等待所有页面资源加载完成。
2. 记得检查fill()函数里的HTML拼接逻辑，确保最终生成的标签结构符合你的需求。

内容的提问来源于stack exchange，提问作者David Mathers