<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 ...
随机推荐
- https://software.intel.com/sites/landingpage/pintool/docs/97998/Pin/html/
https://software.intel.com/sites/landingpage/pintool/docs/97998/Pin/html/ http://www.brendangregg. ...
- centos sqlite3安装及简单命令
安装:方法一:wget http://www.sqlite.org/sqlite-autoconf-3070500.tar.gztar xvzf sqlite-autoconf-3070500.tar ...
- [转]微软word的多级列表的bug的解决办法和吐槽
原文地址:https://blog.csdn.net/haoyujie/article/details/80601455 1. 问题引出 这向天,在编写一系列文档. 其中一篇要今天交,前天写好后,一 ...
- Flutter修改应用图标及图标
应用名称是需要在 Android 和 iOS 中分别调整的:Android 是在 AndroidManifest.xml 中修改:iOS 则是在 Info.plist 中修改的: 如果需要更改应用的 ...
- 多重if结构
package com.imooc; import java.util.Scanner; public class TypeExchange { public static void main(Str ...
- EXCEL导入配置开发
1.登录infor 企业级 选择 配置 EXCEL导入配置 2.新增配置(设置模板名.说明.存储过程名称.应用仓库) 后保存 3.将excel模板放到服务器 路径:/opt/infor/sce/wil ...
- SQLite带参数处理方法
/// <summary> /// 执行语法[新增 修改 删除] /// </summary> /// <param name="sqlText"&g ...
- Spring cloud微服务安全实战-_5-10实现基于session的SSO(Token有效期)
refresh_token过期了怎么办,虽然可以设置一个比较长的有效期,但是终归还是要过期的. 只能从认证服务器重新走认证授权的流程. 两种情况 1,session还没过期的,跳过去之后,直接就知道你 ...
- Qt编写自定义控件69-代码行数统计
一.前言 代码行数统计主要用来统计项目中的所有文件的代码行数,其中包括空行.注释行.代码行,可以指定过滤拓展名,比如只想统计.cpp的文件,也可以指定文件或者指定目录进行统计.写完这个工具第一件事情就 ...
- Nginx 504响应超时
1.问题分析 nginx访问出现504 Gateway Time-out,一般是由于程序执行时间过长导致响应超时,例如程序需要执行90秒,而nginx最大响应等待时间为30秒,这样就会出现超时. ...