插件参数:
- rater第一个参数是AJAX提交的URL
- rater第二个参数
- maxvalue:最大星数
- curvalue:默认选择多少颗星
- title:鼠标放在星上的提示
- enable:可设置true or false,控件是否可用
- rater的第三个参数回调函数
aspx页代码:
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Porschev----Jquery Rating Demo</title>
<link href="css/jquery.rater.css" rel="stylesheet" type="text/css"/>
<script src="Jquery/jquery-1.3.2-vsdoc.js" type="text/javascript"></script>
<script src="Jquery/jquery.rater.js" type="text/javascript"></script>
<script type="text/javascript">
$(function() {
$('#example1').rater("Handler.ashx", { maxvalue: 5, curvalue: 2.5, title: { 1: '一颗星', 2: '二颗星', 3: '三颗星',4:'四颗星',5:'五颗星'} }, function(el, value, res) {
alert(res);
});
})
</script>
</head>
<body>
<form id="form1" runat="server">
<center>
前台选择等级星:
<div id="example1">
</div>
<br />
后台输出等级星:
<div>
<%=str %>
</div>
</center>
</form>
</body>
</html>
.cs代码
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Text;
public partial class _Default : System.Web.UI.Page
{
public string str = string.Empty;
protected void Page_Load(object sender, EventArgs e)
{
StringBuilder sb = new StringBuilder();
sb.Append("<ul style=\" 125px;\" class=\"rating\">");
sb.Append("<li style=\"");
sb.Append(25 * 3.6); //前面是一个星的宽的相素,后面是星的个数
sb.Append("px; display: list-item;\" class=\"current\"></li>");
sb.Append("<li style=\" 25px; z-index: 5;\" class=\"star\"></li>");
sb.Append("<li style=\" 50px; z-index: 4;\" class=\"star\"></li>");
sb.Append("<li style=\" 75px; z-index: 3;\" class=\"star\"></li>");
sb.Append("<li style=\" 100px; z-index: 2;\" class=\"star\"></li>");
sb.Append("<li style=\" 125px; z-index: 1;\" class=\"star\"></li>");
sb.Append("</ul>");
str = sb.ToString();
}
}