`
mimang2007110
  • 浏览: 237254 次
  • 性别: Icon_minigender_1
  • 来自: 西安
社区版块
存档分类
最新评论

点击按钮保存网页中指定的图片，利用js实现

JavaScriptCSS浏览器HTML 
阅读更多

有时候在网页上需要禁用右键菜单，但是需要点击某一按钮保存指定的图片，代码如下：

<html>
	<head>
		<title></title>
		<style type="text/css">
			.mytab{
				 border:1px solid gray;
				 cellspacing:0;
				 cellpadding:0;
			}
		</style>
		
		<script language="javascript" type="text/javascript">
			function save(){
				var img = document.getElementById("testImg");
				var oPop = window.open(img.src,"","width=1,height=1,top=5000,left=5000");
				for(;   oPop.document.readyState   !=   "complete";   ){     
					if   (oPop.document.readyState   ==   "complete")break;  
				}
				oPop.document.execCommand("SaveAs");
				oPop.close();
			}
		</script>
	</head>
	<body>
		<input type="button" value="保存" onclick="save();" /><br/>
		<img id="testImg" width="200px" height="200px" src="1.jpg" alt="测试图片js保存" /><br/>
	</body>
</html>

如果大家有兴趣，可以自己扩展。 

需要注意的是如果把代码拷贝下来放到一个HTML中运行，点击保存按钮时网页会直接在浏览器中打开图片

需要把HTML页面放到服务器中，例如tocmat中，这样访问的话就可以看到效果。

 

 

分享到：
| table控件以及用法
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    点击按钮，html生成图片并下载

    在IT领域，尤其是在Web开发中，"点击按钮，...2. **JavaScript部分**：在JavaScript中，我们需要监听按钮的点击事件，并调用html2canvas库。首先需要引入html2canvas库，通常通过CDN链接或者本地文件引用。 ```html ...

    JS实现网页签名(生成任意格式png、JPG等)

    用户在画布上签名后，可以通过点击按钮或其他交互方式触发保存签名的事件，进而调用相关函数将签名保存为指定格式的图片。 8. **兼容性考虑**： 鉴于项目中包含了FlashCanvas，说明开发者也考虑到了旧版本浏览器的...

    利用javascript实现网页打印

    JavaScript是Web开发中的一种重要脚本语言，它允许开发者在客户端执行动态操作，包括与用户的交互、数据处理以及，如本题所示，实现网页打印功能。网页打印是将网页内容输出到打印机或创建PDF文档的过程，这对于用户...

    将网页生成图片的小功能

    网页生成图片是一种常见的需求，尤其在分享网页内容或者保存页面为离线阅读资料时非常有用。这个"将网页生成图片的小功能"是一个基于Winform应用的工具，它模仿了浏览器内建的截图功能，允许用户将当前显示的网页...

    js定时器实例红绿灯效果网页

    这个实例展示了如何利用JS的定时器功能实现周期性的颜色变化，以及如何通过HTML按钮来控制红绿灯的开关状态。 首先，让我们了解一下JavaScript定时器。在JavaScript中，有两个主要的定时器方法：`setTimeout()` 和 ...

    js截取div并输出为图片

    5. 提供下载功能，用户可以点击按钮将图片保存到本地。 对于那些寻找如何在JavaScript中截取`div`并生成图片的开发者来说，这个项目提供了一个有价值的参考，尤其是它解决了SVG截取的问题。然而，需要注意的是，...

    【cocos creator】网页/浏览器读取保存json/text文件

    不过，开发者仍然可以通过一些API和技巧来实现读取和保存JSON或文本文件。下面将详细探讨这一主题。 一、Web API的使用 1. `FileReader` API：这是HTML5提供的一个用于读取本地文件的接口，可以读取JSON或文本文件...

    js 禁止保存、屏蔽、缓存、页面保护等等代码大全

    本文档汇集了多种使用JavaScript（简称JS）实现的功能，包括但不限于禁止保存网页、屏蔽缓存、保护页面不被右键点击以及控制浏览器的各种行为。接下来，将逐一解释这些代码的功能及其实现原理。 #### 二、禁止保存...

    jQuery实现的扁平数字按钮图片切换焦点图特效源码.zip

    5. **数据管理**：为了跟踪当前显示的图片，源码可能包含了一个变量来保存索引值，或者利用jQuery的`.data()`方法存储每个按钮对应的图片信息。 6. **兼容性处理**：考虑到跨浏览器的兼容性，源码可能包含了对旧版...

    抓取网页图片1.0

    按照软件提示，输入目标网页URL，设置保存路径，点击开始按钮，软件就会自动进行图片抓取。值得注意的是，config文件可能是软件的配置文件，用于存储用户的偏好设置或程序运行参数，但具体内容需要查看软件的帮助...

    java上传图片后立即将图片显示出来

    本文将深入探讨如何利用Java技术实现在图片上传后立即在页面上显示。首先，我们需要理解这个过程涉及的关键技术点，包括文件上传、文件处理以及前端展示。 1. **文件上传**：Java中的文件上传通常使用Servlet或第三...

    【JavaScript源代码】使用auto.js实现自动化每日打卡功能.docx

    提供的示例代码中，包含了打开指定应用、导航至特定页面、点击按钮等操作，如打开"应用服务"、选择"疫情防控"、点击"居家学习"、"健康日报"等。此外，还有模拟日期选择和地理位置获取等步骤，通过滑动和点击操作完成...

    photoswipe之移动端图片放大查看，保存到本地

    Photoswipe提供了这个功能，用户只需点击相应的保存按钮，图片就能被下载到设备的相册或者指定的存储位置。这个功能对于分享和收藏图片非常实用。 6. **使用Photoswipe的步骤**： - 引入Photoswipe的库文件（CSS和...

    uni-app实现视频文件指定目录下载并重命名

    在移动应用开发中，有时我们需要实现一个功能，让用户能够从网络上下载视频文件，并将其保存到特定的本地目录，同时允许用户自定义文件名。uni-app是一个基于Vue.js的多端开发框架，支持H5、小程序、App等平台，它...

    Javascript和asp.net实现多个图片文件一起上传到服务，同时实现删除服务器上上传的图片功能

    这个场景中，我们将讨论如何使用JavaScript（尤其是原生JS）与ASP.NET框架来协同完成这一任务，并且包括删除服务器上已上传图片的实现。这是一篇面向初学者的技术指南，旨在提供一个基本的实现思路和参考方案。 ...

    JS 保存文件

    标题中的“JS 保存文件”指的是使用JavaScript技术在浏览器环境中实现文件保存的功能。JavaScript是一种广泛应用于Web开发的脚本语言，通常用于处理客户端的交互逻辑。在这个场景中，我们讨论的是如何利用JavaScript...

    ajax单按钮文件上传插件

    在IT行业中，文件上传是网页应用中常见的功能之一，尤其在大数据时代，用户需要便捷地上传图片、文档等各类文件。Ajax（Asynchronous JavaScript and XML）技术为实现异步无刷新上传提供了可能，使得用户体验得到...

    AJAX实现8种按钮的不同效果

    本话题将详细讲解如何利用AJAX来实现8种不同的按钮效果，这些效果可以极大地提升用户交互体验。 1. **异步数据加载**： 当用户点击按钮时，AJAX可以发送一个后台请求到服务器，获取新的数据，然后在页面上动态更新...

    利用jquery插件的图片剪切上传功能

    标题中的“利用jquery插件的图片剪切上传功能”指的是在网页中实现用户可以选取图片、剪切并上传的功能，这种功能通常用于个人头像设置、产品图片上传等场景。jQuery是一个广泛使用的JavaScript库，它简化了HTML文档...

    web-原生js实现购物车

    在JavaScript中，我们通常会通过事件监听来捕捉用户的操作，例如点击按钮添加或删除商品。以下是一个简单的示例： ```javascript // 获取添加到购物车的按钮 var addToCartBtn = document.querySelector('#add-to-...

Magicbox
Global site tag (gtag.js) - Google Analytics