jQuery实现图片下载代码


Posted in jQuery onJuly 18, 2019

jQuery 实现图片下载代码,供大家参考,具体内容如下

function downloadImage(src) {
 var $a = $("<a></a>").attr("href", src).attr("download", "meitu.png");
 $a[0].click();
}

关键调用downloadImage函数代码

onclick=downloadImage(url)

完整 js 代码

$(function () {
 $.extend($.fn.bootstrapTable.defaults, $.fn.bootstrapTable.locales['zh-CN'])
 var searchText = $('.search').find('input').val()
 
 var columns = []
 
 columns.push({
 title: '分类',
 field: 'category',
 align: 'center',
 valign: 'middle',
 formatter: function (value, row, index) {
  return value
 }
 }, {
 title: '美图',
 field: 'url',
 align: 'center',
 valign: 'middle',
 formatter: function (value, row, index) {
  return "![](" + value + ")"
 }
 }, {
 title: ' 操作',
 field: 'id',
 align: 'center',
 formatter: function (value, row, index) {
  var html = ""
  html += "<div οnclick='addFavorite(" + value + ")' name='addFavorite' id='addFavorite" + value + "' class='btn btn-default'>收藏</div><p>"
  html += "<div οnclick='deleteById(" + value + ")' name='delete' id='delete" + value + "' class='btn btn-default'>删除</div>"
  return html
 }
 })
 
 $('#meituTable').bootstrapTable({
 url: 'meituSearchJson',
 sidePagination: "server",
 queryParamsType: 'page,size',
 contentType: "application/x-www-form-urlencoded",
 method: 'get',
 striped: false, //是否显示行间隔色
 cache: false, //是否使用缓存,默认为true,所以一般情况下需要设置一下这个属性(*)
 pagination: true, //是否显示分页(*)
 paginationLoop: true,
 paginationHAlign: 'right', //right, left
 paginationVAlign: 'bottom', //bottom, top, both
 paginationDetailHAlign: 'left', //right, left
 paginationPreText: ' 上一页',
 paginationNextText: '下一页',
 search: true,
 searchText: searchText,
 searchTimeOut: 500,
 searchAlign: 'right',
 searchOnEnterKey: false,
 trimOnSearch: true,
 sortable: true, //是否启用排序
 sortOrder: "desc", //排序方式
 sortName: "id",
 pageNumber: 0, //初始化加载第一页,默认第一页
 pageSize: 10, //每页的记录行数(*)
 pageList: [5, 10, 20, 50, 100], // 可选的每页数据
 totalField: 'totalPages',
 dataField: 'content', //后端 json 对应的表格数据 key
 columns: columns,
 queryParams: function (params) {
  return {
  size: params.pageSize,
  page: params.pageNumber,
  sortName: params.sortName,
  sortOrder: params.sortOrder,
  searchText: params.searchText
  }
 },
 classes: 'table table-responsive full-width',
 })
 
 
 $(document).on('keydown', function (event) {
 // 键盘翻页事件
 var e = event || window.event || arguments.callee.caller.arguments[0];
 if (e && e.keyCode == 38 || e && e.keyCode == 37) {//上,左
  // 上一页
  $('.page-pre').click()
 }
 if (e && e.keyCode == 40 || e && e.keyCode == 39) {//下,右
  // 下一页
  $('.page-next').click()
 }
 
 })
 
})

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

jQuery 相关文章推荐
jQuery插件FusionCharts实现的MSBar2D图效果示例【附demo源码】
Mar 24 jQuery
jQuery模拟实现天猫购物车动画效果实例代码
May 25 jQuery
利用jQuery异步上传文件的插件用法详解
Jul 19 jQuery
jQuery ajax调用webservice注意事项
Oct 08 jQuery
jQuery Validate插件ajax方式验证输入值的实例
Dec 21 jQuery
jQuery第一次运行页面默认触发点击事件的实例
Jan 10 jQuery
jQuery实现炫丽的3d旋转星空效果
Jul 04 jQuery
jQuery实现侧边栏隐藏与显示的方法详解
Dec 22 jQuery
Jquery的Ajax技术使用方法
Jan 21 jQuery
JQuery获取元素尺寸、位置及页面滚动事件应用示例
May 14 jQuery
jquery.pager.js实现分页效果
Jul 29 jQuery
如何解决jQuery 和其他JS库的冲突
Jun 22 jQuery
jquery图片预览插件实现方法详解
Jul 18 #jQuery
jquery实现垂直无限轮播的方法分析
Jul 16 #jQuery
JQuery实现简单的复选框树形结构图示例【附源码下载】
Jul 16 #jQuery
jquery实现自定义树形表格的方法【自定义树形结构table】
Jul 12 #jQuery
JavaScript表格隔行变色和Tab标签页特效示例【附jQuery版】
Jul 11 #jQuery
JavaScript实现的弹出遮罩层特效经典示例【基于jQuery】
Jul 10 #jQuery
JavaScript实现的滚动公告特效【基于jQuery】
Jul 10 #jQuery
You might like
PHP求最大子序列和的算法实现
2011/06/24 PHP
PHP imagecreatefrombmp 从BMP文件或URL新建一图像
2012/07/16 PHP
php中heredoc与nowdoc介绍
2014/12/25 PHP
PHP项目多语言配置平台实现过程解析
2020/05/18 PHP
tp5.1 框架数据库高级查询技巧实例总结
2020/05/25 PHP
深入理解JavaScript系列(14) 作用域链介绍(Scope Chain)
2012/04/12 Javascript
浅谈javascript中基本包装类型
2015/06/03 Javascript
jQuery添加和删除输入文本框标签代码
2016/05/20 Javascript
基于JS实现textarea中获取动态剩余字数的方法
2016/05/25 Javascript
详解Javascript中prototype属性(推荐)
2016/09/03 Javascript
js字符串引用的两种方式(必看)
2016/09/18 Javascript
详解Jquery的事件操作和文档操作
2016/12/19 Javascript
Bootstrap源码解读按钮(5)
2016/12/23 Javascript
你不知道的 javascript【推荐】
2017/01/08 Javascript
javascript 显示全局变量与隐式全局变量的区别
2017/02/09 Javascript
前端页面文件拖拽上传模块js代码示例
2017/05/19 Javascript
vue项目中在外部js文件中直接调用vue实例的方法比如说this
2019/04/28 Javascript
createObjectURL方法实现本地图片预览
2019/09/30 Javascript
微信小程序select下拉框实现源码
2019/11/08 Javascript
用VsCode编辑TypeScript的实现方法
2020/05/07 Javascript
[01:00:35]2018DOTA2亚洲邀请赛3月30日B组 EffcetVSMineski
2018/03/31 DOTA
关于python pyqt5安装失败问题的解决方法
2017/08/08 Python
Python中函数的基本定义与调用及内置函数详解
2019/05/13 Python
python并发编程多进程 互斥锁原理解析
2019/08/20 Python
Python中函数的返回值示例浅析
2019/08/28 Python
利用Python绘制Jazz网络图的例子
2019/11/21 Python
python使用SQLAlchemy操作MySQL
2020/01/02 Python
Pyqt5 关于流式布局和滚动条的综合使用示例代码
2020/03/24 Python
澳大利亚珠宝商:Shiels
2019/10/06 全球购物
高级人员简历的自我评价分享
2013/11/03 职场文书
自动化专业毕业生求职信
2014/06/18 职场文书
物流管理专业推荐信
2014/09/06 职场文书
2014年终个人总结报告
2015/03/09 职场文书
文艺部部长竞选稿
2015/11/21 职场文书
python 如何在list中找Topk的数值和索引
2021/05/20 Python
CSS中理解层叠性及权重如何分配
2022/12/24 HTML / CSS