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实现限制textarea输入字数的方法
Sep 06 jQuery
jQuery实现火车票买票城市选择切换功能
Sep 15 jQuery
jquery ajax异步提交表单数据的方法
Oct 27 jQuery
原生JS与jQuery编写简单选项卡
Oct 30 jQuery
jQuery ajax读取本地json文件的实例
Oct 31 jQuery
jquery动态添加以及遍历option并获取特定样式名称的option方法
Jan 29 jQuery
jQuery Dom元素操作技巧
Feb 04 jQuery
jquery层次选择器的介绍
Jan 18 jQuery
解决JQuery的ajax函数执行失败alert函数弹框一闪而过问题
Apr 10 jQuery
使用JQuery自动完成插件Auto Complete详解
Jun 18 jQuery
jQuery中DOM常见操作实例小结
Aug 01 jQuery
JQuery表单元素取值赋值方法总结
May 12 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
一个简单的自动发送邮件系统(二)
2006/10/09 PHP
php抓即时股票信息
2006/10/09 PHP
关于Appserv无法打开localhost问题的解决方法
2009/10/16 PHP
php使用strip_tags()去除html标签仍有空白的解决方法
2016/07/28 PHP
分析php://output和php://stdout的区别
2018/05/06 PHP
jquery 新手学习常见问题解决方法
2010/04/18 Javascript
JS的参数传递示例介绍
2014/02/08 Javascript
一个不错的字符串转码解码函数(自写)
2014/07/31 Javascript
Node.js中使用Buffer编码、解码二进制数据详解
2014/08/16 Javascript
javascript每日必学之继承
2016/02/23 Javascript
jquery注册文本框获取焦点清空,失去焦点赋值的简单实例
2016/09/08 Javascript
JavaScript组成、引入、输出、运算符基础知识讲解
2016/12/08 Javascript
Bootstrap3 多个模态对话框无法显示的解决方案
2017/02/23 Javascript
vue实现简单的MVVM框架
2018/08/05 Javascript
Vue Promise的axios请求封装详解
2018/08/13 Javascript
Vue使用vue-recoure + http-proxy-middleware + vuex配合promise实现基本的跨域请求封装
2019/10/21 Javascript
[02:56]《DAC最前线》之国外战队抵达上海备战亚洲邀请赛
2015/01/28 DOTA
Python实现矩阵加法和乘法的方法分析
2017/12/19 Python
Python使用sort和class实现的多级排序功能示例
2018/08/15 Python
Python中时间datetime的处理与转换用法总结
2019/02/18 Python
Python datetime包函数简单介绍
2019/08/28 Python
Python实现随机生成任意数量车牌号
2020/01/21 Python
详解用Python爬虫获取百度企业信用中企业基本信息
2020/07/02 Python
python使用列表的最佳方案
2020/08/12 Python
详解Python中@staticmethod和@classmethod区别及使用示例代码
2020/12/14 Python
怎样建立和理解非常复杂的声明?例如定义一个包含N 个指向返回 指向字符的指针的函数的指针的数组?
2013/03/19 面试题
大学新生欢迎词
2014/01/10 职场文书
运动会入场解说词300字
2014/01/25 职场文书
校园环保建议书
2014/05/14 职场文书
门店业绩提升方案
2014/06/08 职场文书
八年级英语教学计划
2015/01/23 职场文书
土建技术员岗位职责
2015/04/11 职场文书
入党宣誓仪式主持词
2015/06/29 职场文书
新人入职感言
2015/07/31 职场文书
浅谈PHP7中的一些小技巧
2021/05/29 PHP
Python实现信息管理系统
2022/06/05 Python