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 校验中国身份证号码实例详解
Apr 11 jQuery
基于jQuery实现的单行公告活动轮播效果
Aug 23 jQuery
jQuery Datatables表头不对齐的解决办法
Nov 27 jQuery
jQuery中元素选择器(element)简单用法示例
May 14 jQuery
jQuery基于Ajax实现读取XML数据功能示例
May 31 jQuery
jquery获取select选中值的文本,并赋值给另一个输入框的方法
Aug 21 jQuery
jQuery实现鼠标移到某个对象时弹出显示层功能
Aug 23 jQuery
jQuery实现当拉动滚动条到底部加载数据的方法分析
Jan 24 jQuery
jquery实现下载图片功能
Jul 18 jQuery
jQuery高级编程之js对象、json与ajax用法实例分析
Nov 01 jQuery
jQuery实现简单聊天室
Feb 08 jQuery
jQuery cookie的公共方法封装和使用示例
Jun 01 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制作静态网站的模板框架(三)
2006/10/09 PHP
用PHP+java实现自动新闻滚动窗口
2006/10/09 PHP
FCKeditor的安装(PHP)
2007/01/13 PHP
php 中英文语言转换类代码
2011/08/11 PHP
PHP文件锁函数flock()详细介绍
2014/11/18 PHP
PHP树形结构tree类用法示例
2019/02/01 PHP
jQuery使用手册之二 DOM操作
2007/03/24 Javascript
javascript动态添加、修改、删除对象的属性与方法详解
2014/01/27 Javascript
简介AngularJS中使用factory和service的方法
2015/06/17 Javascript
微信小程序购物商城系统开发系列-目录结构介绍
2016/11/21 Javascript
JavaScript触发onScroll事件的函数节流详解
2016/12/14 Javascript
javascript 秒表计时器实现代码
2017/03/09 Javascript
老生常谈js-react组件生命周期
2017/05/02 Javascript
JS触摸与手势事件详解
2017/05/09 Javascript
微信小程序商品详情页底部弹出框
2019/11/22 Javascript
Vue export import 导入导出的多种方式与区别介绍
2020/02/12 Javascript
js+css3实现简单时钟特效
2020/09/13 Javascript
Python多进程通信Queue、Pipe、Value、Array实例
2014/11/21 Python
python anaconda 安装 环境变量 升级 以及特殊库安装的方法
2017/06/21 Python
Python中input与raw_input 之间的比较
2017/08/20 Python
python实现拓扑排序的基本教程
2018/03/11 Python
记一次python 内存泄漏问题及解决过程
2018/11/29 Python
python生成器/yield协程/gevent写简单的图片下载器功能示例
2019/10/28 Python
python3中利用filter函数输出小于某个数的所有回文数实例
2019/11/24 Python
Python paramiko 模块浅谈与SSH主要功能模拟解析
2020/02/29 Python
Selenium webdriver添加cookie实现过程详解
2020/08/12 Python
纯CSS3实现绘制各种图形实现代码详细整理
2012/12/26 HTML / CSS
CSS3正方体旋转示例代码
2013/08/08 HTML / CSS
CSS3实现缺角矩形,折角矩形以及缺角边框
2019/12/20 HTML / CSS
日本钓鱼渔具和户外用品网上商店:naturum
2016/08/07 全球购物
HSRP的含义以及如何工作
2014/09/10 面试题
祖国在我心中演讲稿
2014/01/15 职场文书
大二学生学年自我鉴定
2014/09/12 职场文书
Windows下使用Nginx+Tomcat做负载均衡的完整步骤
2021/03/31 Servers
一篇文章学会Vue中间件管道
2021/06/20 Vue.js
JavaScript事件的委托(代理)的用法示例详解
2022/02/18 Javascript