个人中心
gpt4 book ai didi

javascript - Intellij IDEA引用错误: $ is not defined

转载 作者：行者123 更新时间：2023-11-28 07:00:16 25 4
gpt4 key购买 nike

我正在使用 Intellij IDEA 14.1.4 并收到“ReferenceError:$未定义”消息。现在我已经搜索了一个多小时，并且阅读了许多建议人们首先运行 jquery 脚本的帖子。我已经完成了此操作，并且页面在浏览器窗口中加载良好。那里一切正常。这是 Intellij IDEA 的问题。我下载了 JQUERY 和 JQUERY UI 库，并使用硬盘上的绝对路径链接到它们。我也尝试过链接到在线的。我不知道如何搜索我需要的东西，因为有很多误报，所以这就是我发帖的原因。

“C:\Program Files (x86)\JetBrains\IntelliJ IDEA 14.1.4\bin\runnerw.exe”“C:\Program Files\nodejs\node.exe”lightbox.jsc:\Users\Aaron\IdeaProjects\DataStructures\Treehouse\src\js\lightbox.js:4var $overlay = $('');//创建jquery对象， ^引用错误:$ 未定义 在对象。 (c:\Users\Aaron\IdeaProjects\DataStructures\Treehouse\src\js\lightbox.js:4:16) 在 Module._compile (module.js:460:26) 在 Object.Module._extensions..js (module.js:478:10) 在 Module.load (module.js:355:32) 在 Function.Module._load (module.js:310:12) 在 Function.Module.runMain (module.js:501:10) 启动时(node.js:129:16) 在node.js:814:3

进程已完成，退出代码为 1

<!DOCTYPE html>
<html>
<head>
    <link rel="stylesheet" href="css/style.css" type="text/css" media="screen" title="no title" charset="utf-8">
    <title>Image Gallery</title>
</head>
<body>
<h1>Image Gallery</h1>
<ul id="imageGallery">
    <li><a href="images/refferal_machine.png"><img src="images/refferal_machine.png" width="100" alt="Refferal Machine By Matthew Spiel"></a></li>
    <li><a href="images/space-juice.png"><img src="images/space-juice.png" width="100" alt="Space Juice by Mat Helme"></a></li>
    <li><a href="images/education.png"><img src="images/education.png" width="100" alt="Education by Chris Michel"></a></li>
    <li><a href="images/copy_mcrepeatsalot.png"><img src="images/copy_mcrepeatsalot.png" width="100" alt="Wanted: Copy McRepeatsalot by Chris Michel"></a></li>
    <li><a href="images/sebastian.png"><img src="images/sebastian.png" width="100" alt="Sebastian by Mat Helme"></a></li>
    <li><a href="images/skill-polish.png"><img src="images/skill-polish.png" width="100" alt="Skill Polish by Chris Michel"></a></li>
    <li><a href="images/chuck.png"><img src="images/chuck.png" width="100" alt="Chuck by Mat Helme"></a></li>
    <li><a href="images/library.png"><img src="images/library.png" width="100" alt="Library by Tyson Rosage"></a></li>
    <li><a href="images/boat.png"><img src="images/boat.png" width="100" alt="Boat by Griffin Moore"></a></li>
    <li><a href="images/illustrator_foundations.png"><img src="images/illustrator_foundations.png" width="100" alt="Illustrator Foundations by Matthew Spiel"></a></li>
    <li><a href="images/treehouse_shop.jpg"><img src="images/treehouse_shop.jpg" width="100" alt="Treehouse Shop by Eric Smith"></a></li>
</ul>
<script src="C:\Users\Aaron\.IntelliJIdea14\system\extLibs\http_code.jquery.com_jquery-2.0.0.js" charset="utf-8"></script>
<script src="C:\Users\Aaron\.IntelliJIdea14\system\extLibs\http_ajax.googleapis.com_ajax_libs_jqueryui_1.10.2_jquery-ui.js" type="text/javascript" charset="utf-8"></script>
<script src="js/lightbox.js" type="text/javascript" charset="utf-8"></script>
</body>
</html>

这是 JavaScript 代码

var $overlay = $('<div id="overlay"><div></div></div>'); //creates jquery obj, $ is naming convention
var $image = $("<img>");
var $caption = $("<p></p>");
var $index= 0; //Will keep track of image endex from prev/next
var $galleryLength = $("#imageGallery li").length; //store total number of images

//Setup overlay
$overlay.children("div").append($image);//Adds image to the overlay jquery object
$overlay.children("div").append($caption); //Adds caption to the overlay, AFTER the image.
$overlay.children("div").append("<button id='btnPrev'><h4> < </h4></button>"); //create prev button
$overlay.children("div").append("<button id='btnNext'><h4> > </h4></button>"); //create next button
$("body").append($overlay); //adds tag to end of <body>, css for overlay contained in <div>

//updates the image
var updateImage = function(imageLoc, captionText){
    $image.attr("src", imageLoc); //sets $image object to loc of img so its added to overlay
    $caption.text(captionText); //Adds alt attribute text to caption so its displayed below img
};

//captures the click event, when an image is clicked
$("#imageGallery a").click(function(event){
    event.preventDefault(); //prevents browser frop opening img in new window
    var imageLoc = $(this).attr("href"); //stores attribute in var. ex: "images/space-juice.png"
    var captionText = $(this).children("img").attr("alt"); //Store text from alt attr of img's

    $index = $(this).parent().index(); //update index to current selected image
    console.log($index);
    updateImage(imageLoc, captionText); //Passes loc and caption info to update image
    $overlay.slideDown(imageLoc); //display overlay when img clicked
});

//Button Click Events
$("#btnNext").click(function(event){
    button(true);
});

$("#btnPrev").click(function(event){
    button(false);
});

var button = function(next){

    if(next == true){ //if next is true move forward an image
        $index++;
    }
    else{ //otherwise go to previous image
        $index--;
    }

    //If index is out of bounds reset to first image or last image as needed
    if($index < 0){
        $index = $galleryLength - 1;
    }
    else if($index > $galleryLength - 1){
        $index = 0;
    }

    //selects the element by index and then gets the link to the image
    var newImage = $("#imageGallery li").get($index).getElementsByTagName("a");
    //Store link information in variables
    var imageLoc = $(newImage).attr("href");
    var captionText = $(newImage).children("img").attr("alt");
    //Update the current image with new image information
    updateImage(imageLoc, captionText);

};

//captures the click event, when the overlay is clicked
$overlay.click(function(event){
    if(event.target.id == "overlay"){
        $(this).slideUp("fast");
    }
});

最佳答案

您可以轻松地为jquery和任何其他框架执行此操作(在idea Ultimate 2019.2中测试)

  1. 转到文件 |设置|语言和框架 | JavaScript |图书馆
  2. 点击下载...
  3. 选择 jQuery(您可以输入“jquery”快速找到它)
  4. 下载并安装

通常情况下，IDEA 现在应该识别 jquery 并提供文档。您可以在 IDEA 底部的检查弹出窗口(警察图标)中验证这一点

enter image description here

关于javascript - Intellij IDEA引用错误: $ is not defined，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/32215236/

25 4 0
文章推荐： css - 调整按钮内的文本大小
文章推荐： c++ - 使用 DirectX11 时无法访问 DirectXMath.h
文章推荐： ios - 如何传递数据以嵌入 ViewController？
文章推荐： javascript - AngularJS:提交表单后如何 $setPristine
行者123
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com