前端如何实现单击将图片选中

html-css017

前端如何实现单击将图片选中,第1张

将图片选中 是为了获取图片的src地址 传给后台吧

图片不像表单那样 可以选中然后直接读值 所以我们要换个思路来实现

首先添加个css样式 当图片被点击后 给他换上这个样式 可以显示出来“被选中”的状态 然后用js来读取src地址就可以

我习惯用jquery 帮你这个大概的

$("img").on("click",function(e){

$(this).toggleClass("on")//切换样式

if($(this).hasClasd("on")){

//如果有on样式表示被选中

var picsrc=$(this).prop("src")

//上面这句就获取到了选中图片的src地址

//接着可以做你想要的操作

}

})

希望能帮助到你！

层级关系指向更明确些，如果不行就加！important

例如：

.picContainer img-hover{相应设置 width:150px}这样不行的话就用下行

.picContainer img-hover{相应设置 width:150px!important}