111

<!DOCTYPE html>

<html>

<head>

    <meta charset="utf-8" />

    <title>点评标签 </title>

    <script src="http://apps.bdimg.com/libs/jquery/1.6.4/jquery.min.js"></script>

    <style>

        .tagClass {

            color: lightgray;

            width: 150px;

            height: 35px;

            line-height: 30px;

            text-align: center;

            border: 2px solid lightgray;

            margin: 3px 10px 3px 10px;

            float: left;

            font-size: 20px;

            cursor: pointer

        }

        .tagAddClass {

            color: #FF7744;

            border: 2px solid #FFC8B4;

            background-color: #FFC8B4;

        }

    </style>

</head>

<body>

    <div class="mui-input-row">

        <div class="tagClass">主题鲜明</div>

        <div class="tagClass">学科前沿性</div>

    </div>

    <div class="mui-input-row">

        <div class="tagClass">研究热点难点</div>

        <div class="tagClass">国家重大需求</div>

    </div>

    <script>

        $(function () {

            $(".tagClass").each(function () {

                tagClassClick($(this));

            })

        });

        function tagClassClick(element) {

            var $tagClass = $(element);

            $tagClass.click(function () {

                if ($tagClass.hasClass('tagAddClass')) {

                    $tagClass.removeClass('tagAddClass');

                }

                else {

                    $tagClass.addClass('tagAddClass');

                }

            });

        }

    </script>

</body>

</html>

jquery 实现点评标签 类似淘宝大众点评的 快速准时 货品完好等的更多相关文章

  1. 类似淘宝五星点评 ，Jquery实现代码

    <!--默认五星,根据鼠标点击判断--> <!DOCTYPE html><html lang="en"><head> <met ...

  2. 如何:使用PicturBox实现类似淘宝网站图片的局部放大功能

    转载至http://xuzhihong1987.blog.163.com/blog/static/267315872011822113131823/ 概要: 本文将讲述如何使用PictureBox控件 ...

  3. openresty + lua-resty-weedfs + weedfs + graphicsmagick动态生成缩略图（类似淘宝方案）

    openresty + lua-resty-weedfs + weedfs + graphicsmagick动态生成缩略图(类似淘宝方案) --大部分的网站都要涉及到图片缩略图的处理,比如新闻配图,电 ...

  4. 写一个类似淘宝的ios app需要用到哪些技术？

    写一个类似淘宝的ios app需要用到哪些技术? 让我想起了有人私信我,说不缺钱,做个类似知乎的东西,包括加运营,需要多少钱. 扯淡结束,正好最近看了一点这方面的东西,也许对题主来说有点帮助. 手机淘 ...

  5. Zencart先生成订单后付款，类似淘宝后台修改订单价格

    Zencart 使用 Paypal 付款,会出现漏单的情况,即 paypal 已经收到客户的付款,但是网站后台没有客户的订单.导致 paypal 漏单的原因大致会是当客户跳转到Paypal 网站付款完 ...

  6. jquery插件实现鼠标经过图片右侧显示大图的效果(类似淘宝)

    这个插件的名字elevatezoom,网址为http://www.elevateweb.co.uk/image-zoom,在github上的项目首页为https://github.com/elevat ...

  7. jquery--实现类似淘宝星星评分功能

    -   不正之处,欢迎指正.^-^.好绕的话 贴码.html <body> <div id="div"> <ul> <li>☆< ...

  8. 页面三个txt加载联动省市县的代码，类似淘宝的收货地址的布局

    页面三个txt加载联动省市县的代码,假如有一个树形的JSON,分别显示的省市县这时候三个TXT怎么做联动效果呢,这里用framework7为例HTML: <div class="lis ...

  9. ios 类似淘宝评论星星功能

    创建星星视图: //星星 _myview = [[UIView alloc]initWithFrame:CGRectMake(95, 5, 200, 50)]; UIPanGestureRecogni ...

随机推荐

  1. Bootstrap popover源码分析

    /* ======================================================================== * Bootstrap: popover.js ...

  2. ASP.NET调用存储过程并接收存储过程返回值

    ASP.NET调用存储过程并接收存储过程返回值 2010-08-02 11:26:17|  分类: C#|字号 订阅       2010年02月27日 星期六 23:52 假设表结构Create T ...

  3. 转 source insight 复制后光标在前面

    source insight 里编辑的时候,每次粘贴后,光标停留在粘贴内容的前面. 我想把它设定为 粘贴后,光标移动倒粘贴内容的后面. 怎么做? 这是个设置问题,按照下面的步骤设定就可以了. Opti ...

  4. android 添加手机短信，获取手机短信，删除手机短信和修改手机短信

    注意添加权限: <uses-permission android:name="android.permission.READ_SMS"></uses-permis ...

  5. POJ2503 Babelfish map或者hash_map

    POJ2503 这是一道水题,用Map轻松AC. 不过,可以拿来测一下字符串散列, 毕竟,很多情况下map无法解决的映射问题需要用到字符串散列. 自己生成一个质数, 随便搞一下. #include&l ...

  6. vue 简介

    Vue.js是一套构建用户界面的渐进式框架.采用自底向上增量开发的设计.Vue的核心值关注视图层非常容易与其他库和已有的项目整合.另外,Vue完全有能力驱动采用单文件组件和Vue生态系统支持的库开发复 ...

  7. [转]使用git进行版本控制

    使用git进行版本控制 本文将介绍一种强大的版本控制工具,git的基本使用.与之前svn工具类似,首先给出一些常见的使用需求,然后以这些需求为中心,来展开git的学习过程.由于我也是在学习当中所以其中 ...

  8. 关于js-cookie使用出现兼容性问题以及js-cookie的如何使用

    最近使用vue开发的项目,开发过程引入了js-cookie插件,在PC端以及移动端网页调试都没出现问题,但是打包成APP在安卓手机调试发现使用js-cookie保存的数据失效了,然后只能使用local ...

  9. Vue Router过渡动效

    <router-view> 是基本的动态组件,所以我们可以用 <transition> 组件给它添加一些过渡效果: <transition> <router- ...

  10. Springboot 三种拦截Rest API的方法-过滤器、拦截器、切片

    过滤器方式实现拦截(Filter) 通过继承Servlet的Filter类来实现拦截: @Component public class TimeFilter implements Filter { @ ...