怎样给css样式里引入的图片添加点击事件

.communion_header {
height: 88px;
width: 690px;
margin: 0 auto;
background: url(../../images/communicate/communtion_logo.png) no-repeat
50px 30px;
padding: 40px 0 0 270px;
}
----------------------------------------------

<div class="communion_header" >
<div class="search">
<input id="keyword" name="keyword" type="text" class=" input_txt" />
<input type="submit" name="button" id="button" value=" " class="btn_search" onclick="searchPost()" />
<input type="button" name="button" id="button" value=" " class="btn_ask" onclick="ask()";/>
</div>
</div>

怎样给communtion_logo.png 这个图片添加点击事件?

点击事件只能设置在html元素中,所以background是没有办法设置点击的。但是,它的元素div是有点击事件onclick的。如果div设置onclick无效,建议使用jquery来绑定div的click事件。
此外,由于div中还有其它元素有click事件,所以,这就涉及到了事件冒泡的问题。
那么,说到这,指出你的一个代码问题。网页中,html元素的id必须是唯一的。如果id不唯一,一代涉及id,程序可能会出错。而class才是可以重复的。
可以如下纠正:
<input type="submit" name="button" id="btn_searc" value=" " class="button">
<input type="button" name="button" id="btn_ask" value=" " class="button" >
下面就是解决事件冒泡问题了,还是建议jquery来解决
对于div的内层元素,我们使用jquery来绑定它的单击事件,并且静止响应div的单击事件
$('#btn_searc').blind('click',function(event){
searchPost(); //这里响应id为btn_searc元素的单击事件
event.stopPropagation(); //这局话就是停止事件冒泡了,也就是说,接下来的div的单击事件将不再会被响应。

});
同理,另外一个原色的单击事件可以如下
$('#btn_ask').blind('click',function(event){
ask();

event.stopPropagation();

});
那么,接下来就是去绑定div的单击事件,首先,还是将div的class改成id,并保证其唯一性。同时,css也要改成id的选择器:
#communion_header{
height: 88px;
width: 690px;
margin: 0 auto;
background: url(../../images/communicate/communtion_logo.png) no-repeat 50px 30px;
padding: 40px 0 0 270px;
}
jquery绑定click
$('#communion_header').click(function(){
//这里写div的单击代码。可以使用JavaScript,更可以使用其进阶语言jQuery

});

最后,需要说明的是,代码使用的是JavaScript语言的一种进阶语言jQuery。它的使用要借助于jQuery库的存在。所以你必须去下载个jquery.js,并且在网页中添加关联。
温馨提示:内容为网友见解,仅供参考
第1个回答  2013-06-13
没看懂你的问题。

我的猜测,
communtion_logo.png,应该是一个CSS 精灵的图片,你调用了一部分?

你的两个input 标签都有onclick 事件啊。你把图片传上来,我看下你到底要在哪里加点击事件、、。追问

给 communtion_logo.png 这个图片加点击事件啊

第2个回答  2015-12-26
<html>
<Head>
<style>
#img1{
不可能在css样式里面加 链接的

}

</style>
<head>
<body>
只能这样加
<a href="http://www.baidu.com>"<img src="file:///C|/Users/Administrator/Desktop/005.jpg" /></a>

</body>

</html>
第3个回答  2013-06-13
用a标签包起来就行了啦,,,,这样的布局,还要给背景加链接????这孩子想干嘛

怎样给css样式里引入的图片添加点击事件
('#btn_searc').blind('click',function(event){ searchPost(); \/\/这里响应id为btn_searc元素的单击事件 event.stopPropagation(); \/\/这局话就是停止事件冒泡了,也就是说,接下来的div的单击事件将不再会被响应。});同理,另外一个原色的单击事件可以如下 ('#btn_ask').blind('click',...

如何给图片加click事件 jquery代码
首先要给图片添加一个Id,之后在jquery中写如下代码:("#图片ID").click(function(){ alert("aa”);});或者 ("#图片ID").bind("click",function(){ alert("aa");});

css当点击容器内的元素时,如何绑定到容器的点击事件
定义class下的class,这个的意思就是btn-today下的span的active事件,因为你原先定义的是btn-today的事件,所以点span没反应,你按这样给span加个active就可以了

前端如何实现单击将图片选中
首先添加个css样式 当图片被点击后 给他换上这个样式 可以显示出来“被选中”的状态 然后用js来读取src地址就可以 我习惯用jquery 帮你这个大概的 ("img").on("click",function(e){ (this).toggleClass("on");\/\/切换样式 if($(this).hasClasd("on")){ \/\/如果有on样式表示被选中 var ...

css给按钮设置图片?
css中如何添加图片按钮直接设置一个区域设置好背景图片,然后键或闭给这个区域设置点击事件就可以了,直接给按团迅钮,这个标签设置背景稿裂图片时不能实现的。div+css布局中的怎么设置设置按钮的背景图片你可以用inputtype="image"吵野src=""备碰掘\/,src属性填入指定的按钮仿核图片路径 css特效中如何使...

js怎么实现点击图片预览后在客户区点击左边显示左箭头
1、首先,创建一个图片列表,并给每个图片绑定点击事件,当点击图片时,打开一个蒙层,并将图片克隆到蒙层中,设置为原图片的位置,然后通过CSS3的transform属性实现图片的放大和居中效果。2、其次,在蒙层中添加两个箭头元素,并设置为绝对定位,分别位于客户区的左右两侧。可以通过CSS的伪元素或SVG来...

像塑专业版如何做点击固定按钮特效
首先,需要确定按钮的具体位置和样式需求。接着,使用HTML和CSS编写代码来创建一个固定按钮的元素,并通过CSS设置其样式和位置。然后,利用JavaScript添加点击事件的监听器,确保按钮能够响应用户的点击操作。在点击事件的处理函数中,可以编写相应的代码来实现各种特效,例如改变按钮的颜色、大小或触发动画效果,...

可以给div添加点击事件,只让其背景图片变大吗
可以的,css3中有一个background-size可以规定背景的尺寸

怎么样用javascript让图片可以点击?怎样用javascript给图片加背景?
这样可以给img绑定一个click事件,具体怎么实现就看test()方法里面怎么写了。至于你说的给图片添加背景,我就完全不明白是什么意思了。

jquery 点击事件 实现图片切换
1px solid red} .imgs{display:none} .imgs .cur{display:block} jquery代码:(function(){ (".label span").click(function(){ (this).addClass("cur").siblings().removeClass("cur");(".imgs").removeClass("cur").eq($(this).index()).addClass("cur");})})...

相似回答