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实现Select下拉列表进行状态选择功能
Mar 30 jQuery
JS与jQuery实现子窗口获取父窗口元素值的方法
Apr 17 jQuery
jquery拖动改变div大小
Jul 04 jQuery
JQuery 选择器、DOM节点操作练习实例
Sep 28 jQuery
基于jQuery解决ios10以上版本缩放问题
Nov 03 jQuery
jQuery实现所有验证通过方可提交的表单验证
Nov 21 jQuery
jQuery实现的淡入淡出图片轮播效果示例
Aug 29 jQuery
jquery树形插件zTree高级使用详解
Aug 16 jQuery
jquery 键盘事件 keypress() keydown() keyup()用法总结
Oct 23 jQuery
jQuery Raty星级评分插件使用方法实例分析
Nov 25 jQuery
jquery实现鼠标悬浮弹出气泡提示框
Dec 23 jQuery
jQuery实现穿梭框效果
Jan 19 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中define用法实例
2015/07/30 PHP
thinkphp5.1框架模板布局与模板继承用法分析
2019/07/19 PHP
laravel清除视图缓存的代码
2019/10/23 PHP
JavaScript入门教程(3) js面向对象
2009/01/31 Javascript
prototype 中文参数乱码解决方案
2009/11/09 Javascript
JS中自定义定时器让它在某一时刻执行
2014/09/02 Javascript
JsRender实用入门教程
2014/10/31 Javascript
JavaScript简单实现弹出拖拽窗口(一)
2016/06/17 Javascript
bootstrap模态框垂直居中效果
2016/12/03 Javascript
jQuery实现立体式数字动态增加(animate方法)
2016/12/21 Javascript
深入理解vue.js中的v-if和v-show
2017/06/22 Javascript
Vue.js实现实例搜索应用功能详细代码
2017/08/24 Javascript
vue按需加载组件webpack require.ensure的方法
2017/12/13 Javascript
Angular实现点击按钮控制隐藏和显示功能示例
2017/12/29 Javascript
微信小程序官方动态自定义底部tabBar的例子
2019/09/04 Javascript
详解Vue中Axios封装API接口的思路及方法
2020/10/10 Javascript
Vue实现手机号、验证码登录(60s禁用倒计时)
2020/12/19 Vue.js
使用Python生成随机密码的示例分享
2016/02/18 Python
Django自定义分页与bootstrap分页结合
2021/02/22 Python
Django实现快速分页的方法实例
2017/10/22 Python
python SSH模块登录,远程机执行shell命令实例解析
2018/01/12 Python
Python实现自定义顺序、排列写入数据到Excel的方法
2018/04/23 Python
python在html中插入简单的代码并加上时间戳的方法
2018/10/16 Python
python 画二维、三维点之间的线段实现方法
2019/07/07 Python
django-rest-swagger对API接口注释的方法
2019/08/29 Python
Pytorch模型转onnx模型实例
2020/01/15 Python
requests在python中发送请求的实例讲解
2021/02/17 Python
HTML5 canvas实现的静态循环滚动播放弹幕
2021/01/05 HTML / CSS
中国最大的团购网站:聚划算
2016/09/21 全球购物
黑猩猩商店:The Chimp Store
2020/02/12 全球购物
绝对经典成功的大学生推荐信
2013/11/08 职场文书
怎样写好自我评价呢?
2014/02/16 职场文书
旅游管理毕业生自荐信范文
2014/03/19 职场文书
财务管理专业毕业生求职信
2014/06/02 职场文书
清明节网上祭英烈寄语2015
2015/03/04 职场文书
运动会班级口号霸气押韵
2015/12/24 职场文书