这段时间做一个小网站发现有时候特别需要点击不同的按钮去加载不同的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. JS图表插件(柱形图、饼状图、折线图)

    http://www.open-open.com/lib/view/open1406378625726.html

  2. objective-c可变数组

     1 #pragma mark ---------------可变数组-----------------  2 //        可以在数组里面进行增删改的操作  3 //  4 //        ...

  3. 模板类重载<<运算符

    写了一个Matrix模板类,需要重载<<, 1.需要友元函数 2.需要此函数的实现在.h中(本人试验出来的,放在.cpp中编译不通过) template <typename T> ...

  4. Java RSA 密钥生成工具

    MAC openssl: RSA加解密 第一条命令是生成密钥长度为1024的密钥: 第二条命令是从中生成公钥: 第三条命令是使用pkcs8编码密钥为私钥 http://blog.csdn.net/ch ...

  5. 聊聊Android的APK反编译

    上一篇<How To Use Proguard in Android APP>介绍了如何对Android进行混淆,现在来对它进行反编译看看,里面有些什么东西. APK文件,其实也是一个压缩 ...

  6. CSDN-markdown编辑器

    欢迎使用Markdown编辑器写博客 本Markdown编辑器使用StackEdit修改而来,用它写博客,将会带来全新的体验哦: Markdown和扩展Markdown简洁的语法 代码块高亮 图片链接 ...

  7. JQ 练习题

    1.留言板 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w ...

  8. Android Programming: Pushing the Limits -- Chapter 2: Efficient Java Code for Android

    Android's Dalvik Java 与 Java SE 进行比较 Java代码优化 内存管理与分配 Android的多线程操作 Android’s Dalvik Java 与 Java SE ...

  9. Android源码-学习随笔

    在线代码网站1:http://grepcode.com/project/repository.grepcode.com/java/ext/com.google.android/android/ 书籍: ...

  10. Java Eclipse进行断点调试

    如何调试Java程序? 大家最开始学习Java,都会觉得IDE调试好高端有木有,其实很简单了. 下文会尽量简单直观的教会你在Eclipse中调试,其他的IDE调试步骤也是类似的. 1.在你觉得有错的地 ...