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实现的手风琴侧边菜单效果
Mar 29 jQuery
jQuery实现上传图片前预览效果功能
Aug 03 jQuery
jQuery的时间datetime控件在AngularJs中的使用实例(分享)
Aug 17 jQuery
jQuery实现的上传图片本地预览效果简单示例
Mar 29 jQuery
jQuery length 和 size()区别总结
Apr 26 jQuery
jQuery 获取除某指定对象外的其他对象 ( :not() 与.not())
Oct 10 jQuery
jQuery中each和js中forEach的区别分析
Feb 27 jQuery
js/jQuery实现全选效果
Jun 17 jQuery
Jquery 动态添加元素并添加点击事件实现过程解析
Oct 12 jQuery
jquery轻量级数字动画插件countUp.js使用详解
Oct 17 jQuery
jQuery实现王者荣耀手风琴效果
Jan 17 jQuery
JQuery通过键盘控制键盘按下与松开触发事件
Aug 07 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打造的tab选项卡效果代码(不用js)
2010/12/29 PHP
如何用php获取文件名后缀
2013/06/09 PHP
用函数式编程技术编写优美的 JavaScript_ibm
2008/05/16 Javascript
js弹出层(jQuery插件形式附带reLoad功能)
2013/04/12 Javascript
JSON传递bool类型数据的处理方式介绍
2013/09/18 Javascript
jquery序列化表单去除指定元素示例代码
2014/04/10 Javascript
JS截取url中问号后面参数的值信息
2014/04/29 Javascript
一个JS函数搞定网页标题(title)闪动效果
2014/05/13 Javascript
jQuery .tmpl() 用法示例介绍
2014/08/21 Javascript
JavaScript学习笔记之Cookie对象
2015/01/22 Javascript
百度地图API之本地搜索与范围搜索
2015/07/30 Javascript
JQuery用户名校验的具体实现
2016/03/18 Javascript
使用jQuery制作基础的Web图片轮播效果
2016/04/22 Javascript
Asp.Net之JS生成分页条的方法
2016/11/23 Javascript
彻底理解js面向对象之继承
2018/02/04 Javascript
angularjs实现table增加tr的方法
2018/02/27 Javascript
vue拖拽组件使用方法详解
2018/12/01 Javascript
微信小程序实现Session功能及无法获取session问题的解决方法
2019/05/07 Javascript
Vue编程式跳转的实例代码详解
2019/07/10 Javascript
[03:07]完美世界DOTA2联赛PWL DAY10 决赛集锦
2020/11/11 DOTA
Python运算符重载详解及实例代码
2017/03/07 Python
matplotlib在python上绘制3D散点图实例详解
2017/12/09 Python
python实现人人自动回复、抢沙发功能
2018/06/08 Python
python3+PyQt5 自定义窗口部件--使用窗口部件样式表的方法
2019/06/26 Python
详解使用PyInstaller将Pygame库编写的小游戏程序打包为exe文件
2019/08/23 Python
python3用PyPDF2解析pdf文件,用正则匹配数据方式
2020/05/12 Python
解决Ubuntu18中的pycharm不能调用tensorflow-gpu的问题
2020/09/17 Python
EJB面试题
2015/07/28 面试题
医生实习工作总结的自我评价
2013/09/27 职场文书
开工庆典邀请函范文
2014/01/16 职场文书
幼儿园小班教学反思
2014/02/02 职场文书
英文自荐信常用句子
2014/03/26 职场文书
见习报告的格式
2014/10/31 职场文书
创业计划书之牛肉汤快餐店
2019/10/08 职场文书
Nginx反向代理及负载均衡如何实现(基于linux)
2021/03/31 Servers
JavaScript实例 ODO List分析
2022/01/22 Javascript