Javascript 使用Jquery从div中获取url

我正在尝试创建我自己的灯箱画廊，我觉得我就快到了

我的图库目前是一个网格设置，网格中每个单元格的预览将是一个

img

，其中

img

url通过CSS放置。现在，除非我可以提取css代码中使用的url，否则我将在html代码中放置锚定标记。然后我使用

this

尝试从

html

标记中提取url，并将其放置在灯箱的

img src

中

单击单元格并显示lightbox的代码可以工作，但不能将标记中的html插入lightbox

这很难解释，所以希望下面的代码能给你一个想法

$（文档）.ready（函数（$）{
$（'.image项'）。单击（函数（e）{
e、 预防默认值（）；
var image_href=$（this.attr（“href”）；
$（“#lightbox”）.css（“显示”、“块”）；
$（'#content'）.html（''）；
});
$（'body'）。在（'click'，'#lightbox'，函数（）上{
$（“#lightbox”）.css（“显示”、“无”）；
});
});
#图库{
高度：1200px；
位置：相对位置；
宽度：90%；
左缘：5%；
填充顶部：75px；
}
.图像项目{
显示器：flex；
证明内容：中心；
对齐项目：居中；
字体系列：Thasadith；
字体大小：400；
字号：18px；
字母间距：3px；
颜色：#fff；
文本转换：大写；
背景颜色：钢蓝色；
}
#图像库{
显示：网格；
高度：1150px；
网格模板行：重复（4，1fr）；
网格模板列：重复（3，1fr）；
栅隙：20px；
宽度：100%；
}
.image-item.1{
网格行：跨度2；
格构柱：跨度2；
}
图二{
网格行：跨度3；
格构柱：跨度3；
}
.图片-项目3{
网格行：跨度3；
格构柱：跨度2；
}
.图片-项目4{
网格行：跨度3；
格构柱：跨度1；
}
#灯箱{
位置：固定；
排名：0；
左：0；
宽度：100%；
身高：100%；
背景色：黑色；
不透明度：0.5；
文本对齐：居中；
z指数：2；
显示：无；
}
#灯箱p{
文本对齐：右对齐；
颜色：#fff；
右边距：20px；
字体大小：12px；
}
#灯箱img{
盒影：0.25px#111；
-网络工具包盒阴影：0 25px#111；
-moz盒阴影：0 25px#111；
最大宽度：940px；
}

点击关闭

您正在尝试检索您的img标签的
href
值

var image_href = $(this).attr("href");

应该是

var image_href = $(this).children('a').attr("href");


$（文档）.ready（函数（$）{
$（'.image项'）。单击（函数（e）{
e、 预防默认值（）；
var image_href=$（this.children（'a'）.attr（“href”）；
$（“#lightbox”）.css（“显示”、“块”）；
$（'#content'）.html（''）；
});
$（'body'）。在（'click'，'#lightbox'，函数（）上{
$（“#lightbox”）.css（“显示”、“无”）；
});
});
#图库{
高度：1200px；
位置：相对位置；
宽度：90%；
左缘：5%；
填充顶部：75px；
}
.图像项目{
显示器：flex；
证明内容：中心；
对齐项目：居中；
字体系列：Thasadith；
字体大小：400；
字号：18px；
字母间距：3px；
颜色：#fff；
文本转换：大写；
背景颜色：钢蓝色；
}
#图像库{
显示：网格；
高度：1150px；
网格模板行：重复（4，1fr）；
网格模板列：重复（3，1fr）；
栅隙：20px；
宽度：100%；
}
.image-item.1{
网格行：跨度2；
格构柱：跨度2；
}
图二{
网格行：跨度3；
格构柱：跨度3；
}
.图片-项目3{
网格行：跨度3；
格构柱：跨度2；
}
.图片-项目4{
网格行：跨度3；
格构柱：跨度1；
}
#灯箱{
位置：固定；
排名：0；
左：0；
宽度：100%；
身高：100%；
背景色：黑色；
不透明度：0.5；
文本对齐：居中；
z指数：2；
显示：无；
}
#灯箱p{
文本对齐：右对齐；
颜色：#fff；
右边距：20px；
字体大小：12px；
}
#灯箱img{
盒影：0.25px#111；
-网络工具包盒阴影：0 25px#111；
-moz盒阴影：0 25px#111；
最大宽度：940px；
}

点击关闭

你的
$（“#内容”）在html中的哪里
我的错，对不起。现在包括在内了