<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 ...
随机推荐
- Prometheus基于consul自动发现监控对象 https://www.iloxp.com/archive/11/
Prometheus 监控目标为什么要自动发现 频繁对Prometheus配置文件进行修改,无疑给运维人员带来很大的负担,还有可能直接变成一个“配置小王子”,即使是配置小王子也会存在人为失误的情况 ...
- Typora的日常使用方法
原文地址:https://www.jianshu.com/p/a6a6a22e9393 ” Markdown 是一种轻量级标记语言,创始人是约翰·格鲁伯(John Gruber).它允许人们 “使用易 ...
- MySQL 权限管理 用户管理
我使用的是 MariaDB 数据库 查看 MySQL 所有用户: select distinct concat('User: \'',user, '\'@\'', host, '\'') as que ...
- pythonUDP发送结构体,对齐到C++结构体
给出程序先: import random import socket import struct import threading import pickle import json from str ...
- AdapterViewFlipper
使用AdapterViewFiller组件设置图片轮播,该组件可以自动切换view <?xml version="1.0" encoding="utf-8" ...
- ECMAScript 6.0基础入门教程
ECMAScript 6.0基础入门教程 转:https://blog.csdn.net/hexinyu_1022/article/details/80778727 https://blog.csdn ...
- SpringBoot启动嵌入式tomcat源码解读
一.SpringBoot自动拉起Tomcat SpringBoot框架是当前比较流行的java后端开发框架,与maven结合大大简化了开发人员项目搭建的步骤,我们知道SpringBoot的启动类启动后 ...
- 果卿居士-《四种清净明诲》之不淫欲 -------------------------------------------------------------------------------- (转自学佛网:http://www.xuefo.net/nr/article19/186541.html)
“如不断淫”, “阿难,如不断淫,修禅定者,如蒸砂石.欲其成饭.经百千劫.只名热砂.何以故.此非饭本.砂石成故.” 阿难啊,如果这个修行的人,最后不能断除淫欲,包括夫妻之间的淫欲,如果你不能断除这个欲 ...
- time zone list
GMT UTC WET WET CET CET MET CET ECT CET EET EET MIT Pacific/Apia HST Pacific/Honolulu AST America/An ...
- Python - Django - ORM 一对一表结构
当一张表的某一些字段查询的比较频繁,另外一些字段查询的不是特别频繁,可以把不怎么常用的字段 单独拿出来做成一张表,然后用一对一的表关联起来 这样既保证数据都完整的保存下来,又能保证检索更快 model ...