对可点击文本进行正面和负面评价
dipsaying a poitive and negative on clickable text
我使用了下面的代码,允许我根据用户点击标题显示数据,但我试图在它旁边添加一个积极的图像,这很容易做到,但是当用户点击标题并显示数据时,想显示negative.png,当他们点击隐藏数据时,我想显示positive.png
<div >
<div class="layer1">
<p class="heading">To view report fields click here</p>
<div class="content" >
<table>
<tr>
<th>Name</th>
</tr>
<tr>
<td><h4>Gender</h4></td>
</tr>
<tr>
<td><h4>Percentage</h4></td>
</tr>
</table>
</div>
</div>
</div>
CSS代码
.layer1 {
margin: 0;
padding: 0;
width: auto;
}
.heading {
margin: 1px;
color:Black;
font-family:Arial;
font-weight:bold;
padding: 3px 10px;
cursor: pointer;
position: relative;
background-color:#C0C0C0;
}
.content {
padding: 5px 10px;
background-color:#fafafa;
}
JavaScript代码jQuery(document).ready(function () {
jQuery(".content").hide();
//toggle the componenet with class msg_body
jQuery(".heading").click(function () {
jQuery(this).next(".content").slideToggle(400);
});
})
使用toggleClass
。编写不同的类来切换
jQuery(document).ready(function () {
jQuery(".content").hide();
//toggle the componenet with class msg_body
jQuery(".heading").click(function () {
jQuery(this).next(".content").slideToggle(400);
jQuery(this).toggleClass("collapse");
});
})
关于toggleClass
相关文章:
- 如何使用jquery在填充自动完成的值后使文本框只读
- 使用Clipboard.js复制span文本
- 使用JS如何动态更改显示的html文件中的文本背景颜色
- 用程序搜索JQuery数据表中的文本
- jQuery匹配JSON对象的部分文本
- onkeyup无法动态创建多个文本区域
- 如何在下面的ES6循环中获得前面的文本
- 将输入字段中的文本提交到我的数据库,同时将其添加到我的列表中
- 让文本输入幻灯片显示输入时的新文本输入?然后向后滑动
- 借助asp.net验证或java脚本对多个文本进行验证
- 无法在ajaxStart中更改跨度文本
- 高亮显示时编辑文本大小和颜色
- jquery中的文本框验证
- Javascript,有没有一种方法可以将数组写成没有逗号或空格的单个文本字符串
- Sails.js:同时发布文本输入和一个文件
- 当鼠标悬停在文本中的单词上时显示警报
- 是否有任何方法可以使用jQuery替换在数组中定义值的文本
- 将纯文本URL转换为可单击链接
- 如何使用nodes和.createElement(“b”)将文本加粗
- 对可点击文本进行正面和负面评价