存档

文章标签 ‘jQuery’

PHP+AJAX 实现星级评分(百度文库评分)

2011年1月11日 admin 1 条评论

好多网站都有评分模块，百度文库,淘宝评价等,现以百度文库为例，简单实现一个基于jQuery的AJAX评分程序。

HTML代码

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20

<div id="header">
 
</div>
 
<div id="main">
  <p><span id="s" class="s"></span><span id="g" class="g"></span></p>
  <div class="rate">
 
     <div class="big_rate">
        <span rate="很差" rscore="2" title="www.shaiblog.com 博客导航">&nbsp;</span>
        <span rate="较差" rscore="4" title="www.shaiblog.com 博客导航">&nbsp;</span>
        <span rate="还行" rscore="6" title="www.shaiblog.com 博客导航">&nbsp;</span>
        <span rate="推荐" rscore="8" title="www.shaiblog.com 博客导航">&nbsp;</span>
        <span rate="力荐" rscore="10" title="www.shaiblog.com 博客导航">&nbsp;</span>
        <div style="width:45px;" class="big_rate_up"></div>
     </div>
     <p><span id="q" class="q"></span></p>
     <div id="my_rate"></div>
  </div>
</div>

阅读全文…

分类: PHP 标签: , , , ,

jQuery性能优化

2010年10月31日 admin 1 条评论

现在jquery应用的越来越多, 有些同学在享受爽快淋漓coding时就将性能问题忽略了, 比如我. jquery虽在诸多的js类库中性能表现还算优秀, 但毕竟不是在用原生的javascript开发, 性能问题还是需要引起重视的.
1，总是从ID选择器开始继承

在jQuery中最快的选择器是ID选择器，因为它直接来自于JavaScript的getElementById()方法。

例如有一段HTML代码：

<div id="content">
<form method="post" action="#">
<h2>交通信号灯</h2>
<ul id="traffic_light">
<li><input type="radio" class="on" name="light" value="red" /> 红色</li>
<li><input type="radio" class="off" name="light" value="yellow" /> 黄色</li>
<li><input type="radio" class="off" name="light" value="green" /> 绿色</li>
</ul>
<input class="button" id="traffic_button" type="submit" value="Go" />
</form>
</div>

阅读全文…

分类: AJAX 标签: ,

jQuery写的展开收起效果

2010年5月5日 admin 没有评论

开始学习jQuery,写几个简单的效果.

Tips:You can change the code before run.

代码很简单源于jQuery很强大

   var $category=$(".proList &gt; .plCon");
	$category.hide();
	var $toggleBtn=$(".plTitle &gt; em");
	//alert($toggleBtn.html());
	$toggleBtn.click(function(){
	 if($(this).parent(".plTitle").next().is(":visible")){
	   $(this).parent(".plTitle").next().slideUp("slow");
	   $(this).prev(".plTitle &gt; a").css("background","url
 
(http://www.wenan8.com/test/icon1.gif) no-repeat left center");
	   $(this).css("background","url(http://www.wenan8.com/test/icon3.gif) 
 
no-repeat left center").text("展开");
	 }else{
	   $(this).parent(".plTitle").next().slideDown("slow");
	   $(this).prev(".plTitle &gt; a").css("background","url
 
(http://www.wenan8.com/test/ico.gif) no-repeat left center");
	   $(this).css("background","url(http://www.wenan8.com/test/icon12.gif) 
 
no-repeat left center").text("收起");
	 }
	 return false;
	})
分类: AJAX 标签: ,