这段时间做一个小网站发现有时候特别需要点击不同的按钮去加载不同的css,这样可以确定点击的是哪个,由于每个按钮都是从后端数据库加载过来的,不仅是简简单单的用id或者是类名,用过this也不行:

前端加载的代码:

 {%for books in bookslist%}
<a href="#" id="a_{{books.books_id}}" name="a_books" onclick="books_message('{{books.books_id}}')">{{books.books_name}}</a>
{%end%}

js(jquery)代码:

 $("a").filter(".list-group-item").css({"background":"#C4E3F3","color":"#31708F"});
$("#a_" + books_id).css({"background":"#31708F","color":"white"});

js代码:

var  a = document.getElementsByName("a_books");

for(i=0;i<=a.length;i++){

a[i].style="";

document.getElementById("#a_" + books_id)..style="background:red";

}在代码下面还可以做其他的操作。。。

实现点击不同的按钮加载不同的css的更多相关文章

  1. bootstrap按钮加载状态改变

    bootstrap里面有个激活按钮的时候,按钮变成不可用的: 按照官网里面的方法介绍是在button按钮加个data-loading-text="Loading..."属性,然后j ...

  2. php+ajax实现登录按钮加载loading效果

    php+ajax实现登录按钮加载loading效果,一个提高用户体验,二个避免重复提交表单,ajax判断加载是否完成. 登录表单 <form onsubmit="return chec ...

  3. VC中使用GDI+实现为按钮加载Png图片

    http://blog.csdn.net/flyfish1986/article/details/5381605 VC中使用GDI+实现为按钮加载Png图片 http://www.codeprojec ...

  4. 动态加载js和css

    开发过程中经常需要动态加载js和css,今天特意总结了一下常用的方法. 1.动态加载js 方法一:动态加载js文件 // 动态加载js脚本文件 function loadScript(url) { v ...

  5. 动态加载js、css 代码

    一.原生js: /** * 加载js和css文件 * @param jsonData.path 前缀路径 * @param jsonData.url 需要加载的js路径或css路径 * @param ...

  6. 用javascript预加载图片、css、js的方法研究

    预加载的好处可以让网页更快的呈现给用户,缺点就是可能会增加无用的请求(但图片.css.js这些静态文件可以被缓存),如果用户访问的页面里面的css.js.图片被预加载了,用户打开页面的速度会快很多,提 ...

  7. 刚部署的程序加载不出来css,js以及图片

    刚部署的程序加载不出来css,js以及图片,解决方式 需要在配置中加入静态资源 方法一: controller.xml中加入 <mvc:annotation-driven/> <mv ...

  8. 【WordPress】外网访问WordPress时无法加载样式表CSS

    情况: 阿里云ECS服务器,用WampServer搭建的WordPress站点,服务端自身访问该站点时显示正常,但外网访问时不能加载样式表CSS的问题. 重要的参考: https://www.doub ...

  9. 动态加载js和css的jquery plugin

    一个简单的动态加载js和css的jquery代码,用于在生成页面时通过js函数加载一些共通的js和css文件. //how to use the function below: //$.include ...

随机推荐

  1. Xcode添加注释

    VVDocumenter-Xcode,自动生成注释,感觉比较方便的插件,分享下,应该很多人都知道= = 在 https://github.com/onevcat/VVDocumenter-Xcode  ...

  2. main方法并发测试

    public static void main(String[] args) throws Exception{ RequestModel r = new RequestModel(); r.setT ...

  3. Xn数列(codevs 1281)

    题目描述 Description 给你6个数,m, a, c, x0, n, g Xn+1 = ( aXn + c ) mod m,求Xn m, a, c, x0, n, g<=10^18 输入 ...

  4. 重写List集合的ToString方法

    重写方法: public class MyList<T> : List<T> where T : IConvertible { public override string T ...

  5. Android Native jni 编程入门

    在某些情况下,java编程已经不能满足我们的需要,比如一个复杂的算法处理,这时候就需要用到jni(java native interface)技术: jni 其实就是java和c/cpp之间进行通信的 ...

  6. Linux系统下设置Tomcat自启动

    需要将tomcat加入自启动队列中,则需要进行如下的操作: 以root用户登录系统: cd /etc/rc.d/init.d/ vi tomcat 文件内容参考如下: #!/bin/sh # # to ...

  7. hdu 1279 验证角谷猜想

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=1279 #include<stdlib.h> #include<time.h> ...

  8. Python中带参装饰器理解

  9. 阿里云 SWAP

    https://yq.aliyun.com/articles/52098 https://www.kejianet.cn/aliyun-swap/

  10. C#值类型与引用类型

    值类型(Value Type),值类型实例通常分配在线程的堆栈(stack)上,并且不包含任何指向实例数据的指针,因为变量本身就包含了其实例数据.其在MSDN的定义为值类型直接包含它们的数据,值类型的 ...