javascript - app.js 文件在被编辑后停止工作

Question

我正在使用模板为建筑公司设计网页。 html 文件使用一个名为 app.js 的 js 文件。每当我编辑 js 文件时，整个 html 页面都会变得无响应，就好像 js 文件从来没有开始过一样。这是 app.js 文件中的代码。

//animate first team member
jQuery('#first-person').bind('inview', function (event, visible) {
    if (visible == true) {
        jQuery('#first-person').addClass("animated pulse");
    } else {
        jQuery('#first-person').removeClass("animated pulse");
    }
});

//animate sectond team member
jQuery('#second-person').bind('inview', function (event, visible) {
    if (visible == true) {
        jQuery('#second-person').addClass("animated pulse");
    } else {
        jQuery('#second-person').removeClass("animated pulse");
    }
});

//animate thrid team member
jQuery('#third-person').bind('inview', function (event, visible) {
    if (visible == true) {
        jQuery('#third-person').addClass("animated pulse");
    } else {
        jQuery('#third-person').removeClass("animated pulse");
    }

该文件与这个预先编写的脚本配合得很好。但是当我尝试为我在 html 文件中创建的新 ID“第四人称”添加以下行时

 //animate fourth team member
 jQuery('#fourth-person').bind('inview', function (event, visible) {
    if (visible == true) {
        jQuery('#fourth-person').addClass("animated pulse");
    } else {
       jQuery('#fourth-person').removeClass("animated pulse");
    }

html 页面变得无响应。如果可能，请告诉我可能是什么问题和解决方案

Answer 1

我至少可以看到两个语法问题，您没有关闭第三人称和第四人称元素的事件绑定(bind)。它们应该是这样的:

//animate fourth team member
 jQuery('#fourth-person').bind('inview', function (event, visible) {
    if (visible == true) {
        jQuery('#fourth-person').addClass("animated pulse");
    } else {
       jQuery('#fourth-person').removeClass("animated pulse");
    }
 }); // <-- This is missing