jQuery在多个div中,删除指定项
之前工作中有一个需求,就是在一堆图片列表中,点击具体的图片,并从界面移除;点击具体的图片,下载;这是一个思路
<style type="text/css" media="screen">
.box {
width: 50px;
height: 60px;
margin: 5px 0;
}
.box:nth-child(1) {
background: red;
}
.box:nth-child(2) {
background: blue;
}
.box:nth-child(3) {
background: red;
}
.box:nth-child(4) {
background: pink;
}
</style>
<body>
<div class="father">
<div class="box">1</div>
<div class="box">2</div>
<div class="box">3</div>
<div class="box">4</div>
</div>
<button type="button" class="btn">删除</button>
<script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.js"></script>
<script>
$(function() {
var deleteIndex=0;
$(".box").click(function() {
console.log($(this).index());
deleteIndex = $(this).index();
$(this).siblings().css({"border":"none"});
// $(this).css({"border-width":"1px","border-style":"solid","border-color":"yellow"});
$(this).css({"border":"10px solid yellow"});
});
$(".btn").click(function() {
// $("father").find[]
$(".father").find(".box")[deleteIndex].remove();
});
});
</script>
</body>
jQuery在多个div中,删除指定项的更多相关文章
- String的两个API,判断指定字符串是否包含另一字符串,在字符串中删除指定字符串。
// 在字符串中删除指定字符串. String phoneNum="1795112345"; phoneNum = phoneNum.replace("17951&quo ...
- splice从数组中删除指定定数据
/*从数组中删除指定定数据var somearray = ["mon", "tue", "wed", "thur"]so ...
- ES6数组中删除指定元素
知识点: ES6从数组中删除指定元素 findIndex()方法返回数组中满足提供的测试函数的第一个元素的索引.否则返回-1. arr.splice(arr.findIndex(item => ...
- arts打卡 从排序数组中删除重复项
Algorithm 从排序数组中删除重复项 给定一个排序数组,你需要在原地删除重复出现的元素,使得每个元素只出现一次,返回移除后数组的新长度. 不要使用额外的数组空间,你必须在原地修改输入数组 ...
- [LeetCode] 80. Remove Duplicates from Sorted Array II ☆☆☆(从有序数组中删除重复项之二)
https://leetcode.com/problems/remove-duplicates-from-sorted-array-ii/discuss/27976/3-6-easy-lines-C% ...
- 一款回到顶部的 jQuery 插件,支持 Div 中的滚动条回到顶部
前言 今天在网上搜索“回到顶部”的 jQuery 插件,网上有很多,但是大部分都不支持让 Div 中的滚动条回到顶部.于是乎,不放弃,自己参考 Github 上的一个 jQuery 插件,经过自己的修 ...
- 【Linux】linux中删除指定文件外所有其他文件(夹)的问题
今天碰到要删除指定文件(夹)外的其他文件的问题.网上查到的方法是这样的 需要在当前文件夹中进行: rm -rf !(keep) #删除keep文件之外的所有文件 rm -rf !(keep1|keep ...
- Java中删除指定文件夹文件夹下面有内容也删除使用递归方案
import java.io.File; import java.text.ParseException; import java.text.SimpleDateFormat; import java ...
- Git中删除指定文件
之前的博客Git基础使用教程介绍了Git这个开源分布式管理系统的一些基础操作,这篇博客,介绍下如何利用Git删除远程仓库的文件... 1.拉取远程仓库的文件到本地 git clone xxx 如果还未 ...
- 从jarray中删除指定元素的问题
string jsonText = "[{\"a\": \"aaa\",\"b\": \"bbb\",\&qu ...
随机推荐
- sqoop从DB2迁移数据到HDFS
Sqoop import job failed to read data from DB2 database which has UTF8 encoding. Essentially, even th ...
- mysql组复制集群简介
mysql组复制集群拓扑: 环境: centos6.5 mysql5.7.19 一.组复制搭建: 配置hosts文件 再三台服务器上分别启动一个mysql实例,共三个. 参考配置文件如下: serve ...
- mongoDB 介绍(特点、优点、原理)
介绍:MongoDB是一个基于分布式文件存储的数据库.由C++语言编写.旨在为WEB应用提供可扩展的高性能数据存储解决方案. 特点:高性能.易部署.易使用,存储数据非常方便. 主要功能特性有: Ø 面 ...
- java 1.8 内存告警问题
Java HotSpot(TM) 64-Bit Server VM warning: ignoring option PermSize=512m; support was removed in 8.0 ...
- 实验一:JAVA实验环境搭建
一. JDK的安装 1.输入 官网地址:http://www.oracle.com/technetwork/java/index.html 如图: 点击之后,就会进入这个界面,进入之后,往下拉点就会看 ...
- WEBGL学习【一】初识WEBGL
<html lang="zh-CN"> <head> <title>NeHe's WebGL</title> <meta ch ...
- [tyvj-2054][Nescafé29]四叶草魔杖 费用流
lyd讲的最小生成树的题. 道理我都懂,费用流多好写,又好调.但和一般费用流不一样的就是它走过一次后费用需调成0,但是再等回流,就恢复原状即可. #include <queue> #inc ...
- MAVEN 的常用命令
1.清除命令:mvn clean 2.编译命令:mvn conpile 3.打包命令:mvn package 4.跳过单元测试命令:mvn clean package -Dmaven.test.sk ...
- 编写 Node.js Rest API 的 10 个最佳实践
Node.js 除了用来编写 WEB 应用之外,还可以用来编写 API 服务,我们在本文中会介绍编写 Node.js Rest API 的最佳实践,包括如何命名路由.进行认证和测试等话题,内容摘要如下 ...
- 《你又怎么了我错了行了吧》【Alpha】Scrum meeting 5
第五天 日期:2019/6/18 前言: 第5次会议在女生宿舍召开 冲刺第5天,对所有工作做了总结.继续完善编码工作. 1.1 今日完成任务情况以及明天任务安排 姓名 当前阶段任务 下一阶段任务 刘 ...