首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

为什么当我点击它时,使用jQuery函数的按钮没有用类:.red,.yellow隐藏我的div?

当你点击按钮时,使用jQuery函数的按钮没有隐藏div的原因可能有以下几种可能性:

  1. 代码错误:首先,你需要确保你的代码没有语法错误或逻辑错误。检查你的代码中是否有拼写错误、缺少分号或括号不匹配等问题。
  2. 选择器错误:确认你使用的选择器是正确的。在这种情况下,你需要使用类选择器来选择具有.red和.yellow类的元素。确保你的HTML元素中有这些类,并且没有其他元素使用相同的类名。
  3. 事件绑定错误:检查你是否正确地绑定了点击事件。确保你的按钮具有正确的ID或类,并且你使用了正确的事件绑定方法,如click()
  4. CSS样式问题:确认你的CSS样式是否正确。检查你的CSS文件或内联样式,确保你为.red和.yellow类定义了正确的样式,并且这些样式能够隐藏div元素。
  5. jQuery库加载问题:确保你已经正确地加载了jQuery库。你可以通过在浏览器控制台中输入$来检查是否成功加载了jQuery库。如果没有加载成功,你需要确保你在HTML文件中正确地引入了jQuery库的链接。

综上所述,当你点击按钮时,使用jQuery函数的按钮没有隐藏div的原因可能是代码错误、选择器错误、事件绑定错误、CSS样式问题或jQuery库加载问题。你可以逐一检查这些可能性,并进行相应的修正。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

与Ajax同样重要jQuery(1)

DOM对象属性方法,DOM对象也无法使用jQuery对象属性方法。...但是我们可以使用jQuery提供方法,将DOM对象通过jQuery()函数包装成为jQuery对象,同样我们可以把jQuery对象转化成DOM对象。...在动画完成执行函数 fadeOut(speed, [callback]) 概述 通过不透明度变化来实现所有匹配元素淡出效果,并在动画完成后可选地触发一个回调函数。...在动画完成执行函数 ④:内容过滤选择器 内容选择器是对子元素和文本内容操作 :contains(text) 选取包含text文本内容元素 $("div:contains...","yellow"); // 对所有既有id又有class属性div元素,添加一个点击事件,打印div标签中内容 $("div[id][class]").click(function(){ alert

10K60

学习jQuery这一篇就够了

提供 API 易于使用且兼容众多浏览器,这让诸如 HTML 文档遍历和操作事件处理动画和 Ajax 操作更加简单。...目前超过 90% 网站都使用jQuery 库,jQuery 宗旨:写更少,做得更多!...,jQuery 定义了这个全局函数供我们调用,既可作为一般函数调用,且传递参数类型不同 / 格式不同,功能就完全不同,也可作为对象调用其定义好方法,此时 就是一个工具对象。...注意:如果存在(不存在)就删除(添加)一个样式 需求描述:当单击按钮时候,隐藏 div,再次单击按钮时候,显示 div .hide { width: 100px; height...', 'red'); }); # 2. blur() 方法描述:当获取焦点触发所绑定函数

81750

es6中class全方面理解(二)------继承

上面代码中,子类constructor方法和say方法中,都出现了super关键字,它在这里表示父构造函数,用来新建父this对象。...子类必须在constructor方法中调用super方法,之后才能使用this关键字,否则新建实例时会报错。这是因为子类没有自己this对象,而是继承父this对象。...1.作为父构造函数调用(已说明) 2.在普通方法中,作为父实例调用(已说明) 3.在静态方法中,作为父调用(下篇文章会做介绍) 实例 创建一个tab切换,页面中有三个按钮内容分别为“中...要求点击按钮按钮以及切换内容背景颜色分别会变为红,黄,绿。 首先创建一个tab.html页面,内容为: <!...=this.id.querySelectorAll("div"); this.colorArr=["red","yellow","green"]; this.index=

81520

25个常规方法优化你jquery代码

处理DOM插入操作,将需要内容包装在一个元素中 嗯,不要问我为什么要这样做(相信一个有相当经验程序员会给你解释)。 在上面的例子中我们使用.html()将1000个item项插入到UL中。...当我点击表格中单元格,上面的代码将使所有单元格背景变为红色。...当你点击按钮,我们希望通过slideDown()和slideUp()进行菜单展开与收缩。...我们仅仅向包装器DIV添加一个额外class,只是告诉我们item项状态。因此在按钮点击之后我们所需要只是click事件处理,这会执行相应slideUp()和slideDown()方法。 ...给你HTML属性增加JS 是从Karl Swedberg那学到这个技巧,过去学习jQuery一直在看他书。 他最近在以前文章留下了对该用法评论,基本原则如下示之。

1.6K10

JQuery 入门学习(一)

一般Jquery代码都放在这个块里面。$("botton")选择了文档中第一个,也就是按钮。click也是一个事件,表示当该按钮点击后执行这里面的代码。...(具体是读取还是修改要看具体情况,在这里就是修改)     所以,点击按钮后,中就被加入了“离别歌”三个字。    ...我们点击按钮后就能看到,“离别歌”三个字变成了红色。 隐藏和显示和动画效果     Jquery自带了一些动画效果,通过一些参数就能显示出来。...也只是改了一句话:$("div#exm").hide('slow'); 将id=exmdiv元素隐藏,并且是慢慢隐藏,因为有'slow'参数。    ...Jquery封装了很多我们平时用最多方法和过程,使得前端编程变得简便。     往后还会继续详细介绍Jquery语法,ajax使用,还会分享一些Jquery插件及其用法。

1.6K11

python_day15_前端_jQue

它是轻量级js库(压缩后只有21k) ,这是其它js库所不及兼容CSS3,还兼容各种浏览器 jQuery是一个快速,简洁javaScript库,使用户能更方便地处理HTMLdocuments...jQuery还有一个比较大优势是,文档说明很全,而且各种应用也说得很详细,同时还有许多成熟插件可供选择。 二 什么是jQuery对象?     ...如果一个对象是 jQuery 对象, 那么它就可以使用 jQuery方法: $(“#test”).html();    基础语法:  jquery基础语法:$(selector).action(...--              // 点击增加以及事件都能使用...windows_yellowHide方法  $(".start").click(function () {                 // 回调函数最后再执行一次函数,  $('.window_yellow

6K20

脚本语言知识总结.

在动画完成执行函数 fadeOut(speed, [callback]) 概述 通过不透明度变化来实现所有匹配元素淡出效果,并在动画完成后可选地触发一个回调函数。...在动画完成执行函数 ④:内容过滤选择器 内容选择器是对子元素和文本内容操作 :contains(text) 选取包含text文本内容元素  $("div:contains...","yellow"); // 对所有既有id又有class属性div元素,添加一个点击事件,打印div标签中内容 $("div[id][class]").click(function(){ ?...² 页面内有两个按钮点击按钮1, 触发按钮2 click事件执行 <script type="text/javascript" src=".....p元素中内容 $("p").one("click",function(){ alert($(this).text()); }); //页面内有两个按钮点击按钮1, 触发按钮2 click事件执行

5K130

jQuery案例】手风琴

利用选择器获取到页面中小方块,通过fadeIn()和fadeOut()方法控制方块显示与隐藏。 案例实现 HTML 页面结构主要使用div、ul、li标签。...思路: 1、设置一个div名为king,用于存放方块。 2、设置方块结构,使用ul定义无序列表结构,使用li代表小方块结构。li名为current,表示初始状态。...3、在li标签内部定义两个div元素,名分别为big和small。big表示大方块,small表示小方块。 4、通过颜色red1和red2等方式设置大小方块颜色。...2、设置最外层盒子样式。最外层盒子也就是名为king元素,设置大小,背景颜色,边距,使其居中显示,隐藏超出盒子部分。 3、设置大小方块背景色。 4、取消列表ul默认样式。...position:relative是基于该元素本身原来位置来定位,当进行位置移动,它还是占用着原来位置。 6、设置初始状态。

1.9K20

jQuery 基本语法

示例解析: 上边效果是点击文档中所有a标签将弹出对话框(alert),其中,$("a") 是一个jQuery选择器,$本身表示一个jQuery,所有$()是构造一个jQuery对象,click(..."); } 运行:当点击id为test元素,背景色变成黄色(yellow) $(elems) 说明:限制jQuery作用于一组特定DOM元素 参数: elem:一组通过jQuery对象压缩DOM...}); }) 最终效果是当鼠标移到id为a层上图层增加一个red样式,离开层移出red样式 toggle(Function, Function)     当匹配元素第一次被点击触发第一个函数...,当第二次被点击触发第二个函数 样式:.red{color:#FF0000} Html代码: sdf jQuery代码及效果 $(...5 举例,click(fn) 扩展 click()  unclick()  oneclick(fn)  unclick(fn) click(fn):增加一个点击触发某函数事件 click():可以在其他事件中执行匹配对象

3.8K40

jQuery

3.切换 $("div").toggleClass("current"); 在原生js中className会覆盖名,在jQuery中指操作指定名,不影响原先名 3.2 jQuery效果...fn :回调函数,在动画完成执行函数 3.2.2 滑入滑出 滑入滑出:slideDown() / slideUp() / slideToggle() ; 3.2.3 淡入淡出 淡入淡出:fadeIn...,第二个是鼠标移出触发函数 只写一个参数,鼠标移入移出都会触发 4.1 jQuery属性操作 4.1.1 元素固有属性值 prop() 获取元素本身自带属性,有利于对表单操作 表单属性...隐式迭代是对同一元素做同一件事情,但是要做不同事情的话还是需要使用遍历 $('div').each(function(index, domEle) {}); 是dom对象不是jQuery对象,需要转换成...'red','blue','yellow']; $('div').each(function(index, domEle) { //index是索引号 domEle是dom元素对象 $(

8.4K10

js显示隐藏 display visibility以及jqueryshow hide区别

js显示隐藏 display visibility以及jqueryshow hide区别 文章包含个人理解,错误请您指出。...元素是可见。 hidden 元素是不可见。 collapse 当在表格元素中使用时,此值可删除一行或一列,但是它不会影响表格布局。被行或列占据空间会留给其他内容使用。...这是为什么呢?...,跟display一样剩下了黄色和蓝色div并且黄色跑到了顶部, 其实hide方法就相当于display none隐藏,不会保留原位置。.../body>  这下是visibility隐藏起作用了  那究竟是谁级别更高呢 个人认为:谁隐藏谁级别就高,会优先执行隐藏属性,display隐藏使用display回流,visibility隐藏使用

5.5K20

jQuery动画,案例

(显示变隐藏,隐藏变显示) toggle([spe],[eas],[fn]) $("button").eq(2).click(function () { $("div").toggle(1000...alert("淡入完毕"); }) }); 自定义动画 有时候jQuery中提供集中简单固定动画无法满足我们需求, 所以jQuery还提供了一个自定义动画方法来满足我们复杂多变需求 animate...(p,[s],[e],[fn]) /* 第一个参数: 接收一个对象, 可以在对象中修改属性 第二个参数: 指定动画时长 第三个参数: 指定动画节奏, 默认就是swing 第四个参数: 动画执行完毕之后回调函数..."div").stop(false, true); // 立即完成当前, 并且停止后续所有的 $("div").stop(true, true); 案例1——新浪微博 主要利用已有的图片素材,通过jQuery...-- 如果有一天要去流浪 <p class

4.9K10

使用jquery-easyui写CRUD插件(1)

但是,通常当我们编写一个插件,力求仅使用一个名字来包含所有内容。...个人来说,喜欢这个Metadata插件,因为让你使用不多"markup”覆盖插件选项(这非常有用当创建例子时)。而且支持非常简单。更新:注释中有一点优化建议。... 现在我们能高亮哪些div使用一行脚本: $('.hilight').hilight(); 2.7 整合 下面使我们例子完成后代码: 这段设计已经让创建了强大符合规范插件...比如我们要开发一个插件,做一个特殊编辑框,当它被点击,便alert 当前编辑框里内容。...实例,当调用成员方法 alertWhileClick后,便实现了扩展,每次被点击它会先弹出目前编辑里内容。

94590

JQuery框架】五大选择器“全家桶”详解!!!

今天来和大家分享一下jQuery五种选择器详细使用方法,那么何为选择器?...从功能上来讲,它能够筛选具有相似特征元素标签,在我们想要对具有相似特征元素进行集中或统一操作是十分有用, 选择器基本操作 首先我们需要了解选择器使用基本操作,该基本操作可以分为三步: 1、事件绑定...选择器使用需要进行事件绑定,一般来说我们可以将事件绑定到一个按钮上去,通过按钮点击来触发相应事件响应。...2、入口函数 同时在jQuery中,这样事件绑定是需要写在一个入口函数中去,在 代码段中建立入口函数语法是: $(function(){ }); 在这里需要注意是...,而第二个选中选择器作用对象是下拉框,同时对于第二种选择器,作用内容是下拉框中包含在内选项,因此在使用时应当使用“>”来具体说明,具体可以看下面的实例: <!

1.5K20
领券