图像交换按钮(Jquery)

2024-04-09

我有一个按钮,当单击它时,我想用图像替换该按钮。我怎样才能在 JQuery 中做到这一点?是否也可以替换图像的背景?按钮本身位于一个大 div 内,我不想在按钮周围添加另一个 div,因为它会弄乱以前的布局。


如果你想替换按钮元素:

$('the-button').bind('click', function () {
    $(this).replaceWith('<img src="/wherever.jpg"/>');
});

如果你想改变按钮的背景图片:

$('the-button').bind('click', function () {
    $(this).css('backgroundImage', 'url(\'/wherever.jpg\')');
});

如果你想改变图像的背景图像(:S):

$('the-button').bind('click', function () {
    $(this).replaceWith('<img src="/wherever.jpg" style="background-image:url(\'/somewhere-else.jpg\');"/>');
});
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

图像交换按钮(Jquery) 的相关文章

  • Android 上的 Chrome 强制隐藏地址栏

    我最近开发了一个获取混合 http https 内容的网站 因此 我总是将地址栏显示在顶部 它不会像其他网站那样自动隐藏 这就是我要说的 This https planetkde org 是网站的链接 内容是从各种来源获取的 因此无法过滤非
  • Jquery Smoothscroll 函数 - 如何控制动画速度?

    有人可以帮助我吗 尝试通过我的平滑滚动和控制速度添加 慢 功能 希望能够实现真正的 平滑滚动 以下是代码 document ready function smoothscroll live click function e html bod
  • 如何使用 JQuery 隐藏和显示 HTML 元素?

    如何使用 JQuery 隐藏和显示 HTML 元素而不产生任何特殊效果 使用hide http docs jquery com Effects hide and show http docs jquery com Effects show方
  • 使用 Jasmine 模拟 jQuery ajax 调用

    我正在使用 Jasmine 2 5 2 为使用 jQuery 3 1 1 执行 Ajax 请求的代码编写单元测试 我想模拟 Ajax 调用 提供我自己的响应状态和文本 我正在使用 Jasmine ajax 插件 https github c
  • JQuery - 如何检测给定 div 中存在给定类的 div 数量?

    我有一个这样的div div class x div 并包含在这个 div 中 我有几个像这样的 div div class y div div class y div div class y div etc 问题1 如何检测容器 div
  • 响应覆盖 div 下的链接

    场景是这样的 我已经构建了一个顶部导航原型 它需要在其顶部有一个覆盖 透明 PNG 图像 目前它覆盖了大约 1 3 的链接 请看下面 有什么方法可以让前 1 3 的链接做出响应 即使有一个 div div 部分覆盖它们 覆盖层不会包含任何可
  • 如果列表在初始化之前为空,则 jQuery 可排序无法与水平列表正常工作

    如果我在初始化后将元素添加到列表中 sortable它无法正常工作 参见示例jsFiddle http jsfiddle net NQMPr 1 示例 HTML div class container div br
  • jQuery 插件 (DataTables) 仅在页面刷新时正确加载

    我在使用数据表时遇到问题 当我从不同页面上的链接转到带有表格的页面时 它只会加载表格的 HTML 文本 版本 没有任何 CSS 格式 也没有 JavaScript 排序 搜索等 但是 当我刷新页面时 它将完美加载 在寻找这个问题的答案后 我
  • 从项目文件加载图像

    我正在尝试获取 png 图像 这是我的资源文件夹 我测试了这里写的解决方案 将图像添加到列表框 c Windows Phone 7 https stackoverflow com questions 9348766 add images t
  • 迭代 div 内的输入

    我试图通过 jQuery 迭代放置在特定 div 上的所有输入 但没有响应 我无法使用警报查看输入的值 我究竟做错了什么
  • 如何重新启动/重置 Jquery 动画

    如何在 jquery 中重置动画 例如 CSS block position absolute top 0 left 0 JS block animate left 50 top 50 如果我做 block stop 动画将停止 但我怎样才
  • 使用 jQuery 修改 svg 文件

    我有一个 svg 文件 其中包含一些形状和一些文本 我想在运行时修改 svg 以便某些形状可以更改颜色 某些文本可以更改其内容 假设我的外部 svg 文件中只有两个元素 圆圈 1 具有该 id 的蓝色实心圆圈 text1 包含该 id 的
  • 从左到右两排的光滑旋转木马

    我需要制作一个从左到右顺序的两行轮播 也有响应 With slider slick rows 2 slidesToShow 3 responsive breakpoint 768 settings slidesToShow 1 我收到这个订
  • 如何以 JavaScript 编程方式获取旋转的 svg 文本边界

    我正在动态渲染 SVG 图像并创建旋转文本 如果旋转的文本与其他文本重叠 我需要删除该文本 但我无法测量旋转的文本来创建边界并检查下一个标签文本区域 我创建了 3 个 SVG 元素来解释 SVG 1 显示重叠的文本 SVG 2 显示重叠的旋
  • 如何在R中的2行之间交换多个值

    我有一个大小为 10x100 的矩阵 如何交换前 30 列中第 1 行和第 2 行之间的值 我们可以反转前两行的行索引以及通过采取序列创建的列索引rounded 30 总列数用于交换行中的值 colS lt seq round ncol m
  • 更改模板标签 <# {% {{ 等后,John Resig 的微模板出现语法错误

    我在使用 John Resig 的 Micro 模板时遇到了一些麻烦 谁能帮我解释为什么它不起作用 这是模板 以及发动机的改装部分 str replace r t n g split join t replace gt t g 1 r re
  • jQuery 提交未触发

    我觉得问这个很愚蠢 但为什么我的 submit 没有发出警报 HTML div class buttonbar style margin left 10 div
  • 如何用方向键移动div

    我想使用 jQuery 用箭头键移动 div 所以右 左 下 上 找到了我想要完成的演示here http atomicrobotdesign com blog htmlcss move objects around the canvas
  • 选择 jQuery 中的每第 n 个项目?

    jQuery 有方便的 even 和 odd 选择器 用于选择集合中偶数或奇数索引的项目 我用它来清除一系列浮动框中的所有其他项目 如下所示 div class 2up div div div div div div div and Cle
  • jQuery异步ajax查询和返回值问题(范围、闭包)

    由于异步查询和变量范围问题 代码无法正常工作 我不明白如何解决这个问题 使用 async false 更改为 ajax 方法 不是一个选项 我知道闭包 但我如何在这里实现它 不知道 我已经在这里看到了有关 js 中的闭包和 jQuery 异

随机推荐

  • PInvoke 'class' 与通过引用传递 'struct'

    当我用谷歌搜索时 我看到帖子说传递 C class与通过相同struct通过引用 即ref SomeStruct name参数 到 C API 同时使用 PInvoke 这是一篇帖子C PInvoke 结构与类访问冲突 https stac
  • jQuery 调用 find 函数在 Firefox 中给出“格式不正确”错误

    我正在从 XML 文件中检索数据 然后使用 jQuery find 函数来访问该数据 但是 在 Firefox 版本 37 0 2 中 我在 JavaScript 控制台中收到以下错误 Error Unable to run script
  • Matplotlib 直方图错位且缺少条形

    我有大量数据文件 因此使用 numpy 直方图 与 matplotlib 中使用的相同 手动生成直方图并更新它们 然而 在绘图时 我感觉图表发生了变化 这是我用来批量手动创建和更新直方图的代码 请注意 所有直方图共享相同的箱 temp np
  • 如何添加管道 |在我的 linux find -exec 命令中?

    这不起作用 这可以在find中完成吗 或者我需要 xargs 吗 find name file follow type f exec zcat agrep dEOE grep 解决方案很简单 通过 sh 执行 exec sh c zcat
  • 需要从c#中的字符串中提取列名

    我正在尝试从 SQL 计算字符串中提取所有列名称 数据保存在数据表的单元格中 并由列周围的方括号确定 我可以提取 的每个实例 但刚刚注意到我有一个问题 有些列具有表名称 有些列具有架构和表名称 例如 列 表 列 或 架构 表 列 我如何修改
  • PostgreSQL:.psql_history 到 /dev/null

    而不是应用一个 set HISTFILE对于每个可能的连接的命令 我们不希望有 psql history根本不 然而 psql 似乎不喜欢这样 ln s dev null psql history psql psql 8 4 8 postg
  • JavaScript 中的二维数组

    对于大学来说 我们有一个关于二维数组的问题需要解决 但是它们的性质从未在课堂上讨论过 我已经在这个网站上搜索答案 这可能在我的代码中很明显 但无法让它工作 甚至无法真正理解正在发生的事情或原因 确切的问题是 Write a program
  • 如何在使用 GDB 遍历代码时禁用 C++ 模板中的单步执行?

    我试图使用 GDB 遍历代码 而 GDB 总是尝试显示 C 模板源代码 这使得调试不方便并且浪费了我很多时间 GDB 尝试介入该函数 当它找不到实现模板的文件时 它会显示错误 或者它会跳转到我不想看到的模板代码 我找不到如何禁用显示 单步进
  • 从“usize”转换为“i32”与其他方式有什么区别?

    我正在创建一个函数 该函数生成一个大小为 n 的随机数数组 但我暂时的比较会引发错误 while ar len as i32 lt size 投诉内容 预计其中之一 lt or gt found 如果我删除as i32它抱怨mismatch
  • Flurry.h 的桥接标头不适用于 Pod

    我有一个现有的桥接头 当前包含多个 obj c pod 我在使用 Xcode 导入 Flurry 框架时遇到问题 Flurry h file not found 即使它已使用 Pod 正确插入 我的桥接标头目前看起来像 import
  • silverlight 文本转语音?

    现在有可用的 silverlight 文本转语音引擎吗 我正在寻找非常简单的文本到语音引擎 需要读出数字 我不想依赖任何网络服务 在最坏的情况下 我会录制一些号码的声音并将它们拼接在一起 任何指点都将受到高度赞赏 我的应用程序不需要在 MA
  • 如何确保在 .NET 中正确处理对象?

    我创建了一个Windows 窗体 http en wikipedia org wiki Windows Forms NET 2 中使用连续运行的 C 的应用程序 对于大多数帐户 我对此感到满意 但有人向我报告 它偶尔会失败 我能够在 50
  • 访问2007到exe

    我在 MS Access 2007 中有一个带有表单的数据库 我需要从访问创建一个独立的 exe 文件 是否可以 如果是这样 怎么办 您不能将其另存为 exe 但您可以使用允许没有访问权限的用户使用您的应用程序
  • 使用 CFExecute 运行 VBScript 会引发错误,但通过命令行可以正常工作

    我正在尝试运行 VBScript 但 CFExecute 抛出错误
  • Django:使用管理上下文扩展基于类的视图的上下文

    我有一个基于类的视图 它只显示配置列表 使用以下代码将此视图添加到 Django 管理站点 admin register ZbxHostConf class ZbxHostConfListViewAdmin admin ModelAdmin
  • MS Graph API:身份验证令牌无效

    我正在尝试使用 Microsoft Graph API 查询 Outlook O365 邮箱中的邮件 我注册我的应用程序 https graph microsoft io en us docs authorization app only在
  • 从 Intellisense 中隐藏(抽象)类

    我有几个抽象类是类库 想从 Intellisense 中隐藏 该怎么做 在类声明之前使用属性 Browsable false EditorBrowsable EditorBrowsableState Never edit 如果类代码在您的解
  • array[::-1] 的时间复杂度和空间复杂度是多少

    当在Python中反转列表时 我通常使用数组 1 进行反转 并且我知道更常见的方法可能是从列表的两侧进行交换 但我不确定这两种解决方案之间的区别 例如时间复杂度和空间复杂度 这两种方法的代码如下 def reverse array arra
  • 如何强制Delphi编译器显示所有提示和警告

    有没有办法强制Delphi编译器一直显示所有提示和警告 这是我目前在 Delphi 6 中看到的行为 从源代码管理中查看我的应用程序的最新副本 在Delphi中打开项目并编译 显示项目的所有提示和警告 更改一个单位 Compile 仅显示更
  • 图像交换按钮(Jquery)

    我有一个按钮 当单击它时 我想用图像替换该按钮 我怎样才能在 JQuery 中做到这一点 是否也可以替换图像的背景 按钮本身位于一个大 div 内 我不想在按钮周围添加另一个 div 因为它会弄乱以前的布局 如果你想替换按钮元素 the b