<a>的javascript+jquery编程实例之删除(定位节点与事件绑定)
相关jquery方法 parent(), remove()
//上传图片 article_create.js article_edit.js
function uploadAttachment() {
/*jQuery-File-Upload*/
var url = '/Common/UploadAttachment';
$('#fileupload').fileupload({
url: url,
dataType: 'json',
done: function (e, data) {
if (data.result.result === true) {
if (data.result.files.length > 0) {
var imgTpl = genrateTmp(image_index);
$("div.media").append(imgTpl);
var curIndex = $(imgTpl).attr("data-index");
var file = data.result.files[0];
$("#preview_img_" + curIndex)[0].src = file.url;
$('#save_name_' + curIndex).val(file.saveName);
$('#files_' + curIndex).text(file.name);
//$("#beforeUpload").removeClass('disabled');
}
}
else {
alert(data.result.Message);
}
}
});
} function genrateTmp(dataIndex) {
var tpl = '<div class="media-body" data-index="{i}">'
+ '<input name = "save_name_{i}" type = "hidden" id = "save_name_{i}" value = "" data-model="article.ImgFileList" />'
+ '<div id="files_{i}" class="files"></div><a onclick="DelImage(this)">删除</a>'
+ '<a class="pull-left thumbnail">'
+ '<img id="preview_img_{i}" class="media-object" src="" onload="DrawImage(200, 200, this)">'
+ '</a>'
+ '</div >';
tpl = tpl.replace(/{i}/g, dataIndex);
++image_index;
return tpl;
} function DelImage(obj)
{
$(obj).parent().remove();
}
<a>的javascript+jquery编程实例之删除(定位节点与事件绑定)的更多相关文章
- <a>实现按钮的javascript+jquery编程实例
涉及知识点:怎样实现让注册的function获取当前<a>,以便通过它进行其他操作 风格一: 1.html端: <td class="text-center"&g ...
- javascript创建节点的事件绑定
javascript创建节点的事件绑定 timeupdate事件是<video>中用来返回视频播放进度的事件,绑定在<video>标签返回视频播放位置(每秒计). 现video ...
- jQuery的三种bind/One/Live/On事件绑定使用方法
本篇文章介绍了,关于jQuery新的事件绑定机制on()的使用技巧.需要的朋友参考下 今天浏览jQuery的deprecated列表,发现live()和die()在里面了,赶紧看了一下,发现从jQ ...
- jquery 深入学习笔记之中的一个 (事件绑定)
[jquery 事件绑定] 1.加入元素事件绑定 (1) 加入事件为当前元素 $('p').on('click',function(){ //code here ... }); (2) 加入事件为未来 ...
- javascript获取childNodes详情,删除空节点
chidNodes返回的是node的集合, 每个node都包含有nodeType属性. nodeType取值: 元素节点:1 属性节点:2 文本节点:3 注释节点:8 页面上是由无数个节点组成 ...
- Javascript高级编程学习笔记(72)—— 模拟事件(2)IE事件模拟
IE中的事件模拟 低版本的IE浏览器作为前端开发的一股清流,想避过都不行 虽然低版本IE正在逐步被市场淘汰,不得不承认IE8以下的浏览器依然占了不小的份额 所以这里大概介绍IE8以下的低版本IE中的事 ...
- Javascript高级编程学习笔记(71)—— 模拟事件(1)DOM事件模拟
事件,指的是网页中某个特定的交互时刻 一般来说事件由浏览器厂商负责提供,一般由用户操作或者其它浏览器功能来触发 但是有一类特殊的事件,那就是由我们开发人员通过JS触发的事件 这些事件和浏览器创建的事件 ...
- JavaScript之Dom操作【删除当前节点】
//最新更新:2017-11-25 //现在可以通过更强大而快捷的方式为所有的HTMLElement元素的Dom操作扩展新的方法[注意事项:处理HTMLElemnt元素时,此法对IE-8无效] //原 ...
- day14—JQuery编程基础
JQuery 1.什么是jQuery jQuery是一个优秀的JavaScript框架.一个轻量级的JavaScript类库.jQuery的核心理念是Write less.Do more. 使用jQu ...
随机推荐
- 清除input的历史记录
原始代码: <input class="" type="text"></input> 加上“autocomplete”属性,禁止历史的显 ...
- HDCMS多图字段的使用?
下面是HDCMS多图字段的简单使用: HDCMS在后台添加的多图,存到数据的时候是经过序列化过的,所以在使用的时候需要进行反序列化操作: $moreImg = M('keshi')->where ...
- centos6的kibana7.1无法启动报错 FATAL Error: /lib64/libc.so.6: version `GLIBC_2.14' not found 升级glibc的问题处理
centos6的kibana7.1无法启动报错 FATAL Error: /lib64/libc.so.6: version `GLIBC_2.14' not found 升级glibc的问题处理 ...
- windows nginx重启脚本.bat
在nginx.exe目录下新建txt文件写入 @echo offtaskkill /f /fi "IMAGENAME eq nginx.exe"start nginx.exe#pa ...
- java中如何使用列表数组
java中如何使用列表数组 觉得有用的话,欢迎一起讨论相互学习~Follow Me 转载链接 https://blog.csdn.net/hgtjcxy/article/details/8183519 ...
- 使用idea创建webservice客户端
new project: Generate Java Code From Wsdl: 导入junit.jar,编写测试类:
- spring 理解Spring AOP 一个简单的约定游戏
应该说AOP原理是Spring技术中最难理解的一个部分,而这个约定游戏也许会给你很多的帮助,通过这个约定游戏,就可以理解Spring AOP的含义和实现方法,也能帮助读者更好地运用Spring AOP ...
- 配置ssh免密,仍需要密码
配置ssh免密码登录后,仍提示输入密码 解决方法: 首先我们就要去查看系统的日志文件 tail /var/log/secure -n 20 Authentication refused: bad ...
- 【超分辨率】—(ESRGAN)增强型超分辨率生成对抗网络-解读与实现
一.文献解读 我们知道GAN 在图像修复时更容易得到符合视觉上效果更好的图像,今天要介绍的这篇文章——ESRGAN: Enhanced Super-Resolution Generative Adve ...
- Python第一阶段05
1.内置方法: 2.Json序列化: import json info = { 'name': 'sisi', } f = open("test.text", "w&qu ...