jquery插件star-rating.js實(shí)現(xiàn)星級(jí)評(píng)分特效
更新時(shí)間：2015年04月15日 11:30:12 投稿：hebedich
Bootstrap Star Rating是一個(gè)簡(jiǎn)單而強(qiáng)大的jQuery插件實(shí)現(xiàn)星級(jí)分?jǐn)?shù)評(píng)級(jí)。支持像分?jǐn)?shù)星填充和RTL輸入先進(jìn)的功能。在利用純CSS-3造型使控制重點(diǎn)開(kāi)發(fā)。該插件使用引導(dǎo)標(biāo)記和造型默認(rèn)情況下，但它可以覆蓋與其他任何CSS的標(biāo)記。
特效介紹
jquery星級(jí)評(píng)分插件star-rating.js下載插件，點(diǎn)擊星星或者心的左邊，就是半分，右邊就是1分。點(diǎn)擊減號(hào)，分?jǐn)?shù)置為0。不兼容IE8以下的瀏覽器。
演示圖
使用方法
第一步、引入下面的代碼：
復(fù)制代碼 代碼如下:
<link href=" <script src=">
<link href="css/star-rating.css" media="all" rel="stylesheet" type="text/css"/>
<script src="js/star-rating.js" type="text/javascript"></script>
第二步、想要使用什么效果，就引入相應(yīng)的input框：
復(fù)制代碼 代碼如下:
<input id="input-2b" type="number" class="rating" min="0" max="5" step="0.5" data-size="xl"
data-symbol="" data-default-caption="{rating} hearts" data-star-captions="{}">
第三步，如果需要重置或者提交按鈕，可以引入下面的代碼：
復(fù)制代碼 代碼如下:
<button type="submit" class="btn btn-primary">Submit</button>
<button type="reset" class="btn btn-default">Reset</button>
第四步、引入js調(diào)用代碼：
復(fù)制代碼 代碼如下:
<script>
jQuery(document).ready(function () {
$(".rating-kv").rating();
});
</script>
以上所述就是本文的全部?jī)?nèi)容了，希望大家能夠喜歡。
您可能感興趣的文章:
- JS實(shí)現(xiàn)星星評(píng)分功能實(shí)例代碼(兩種方法)
- js點(diǎn)亮星星評(píng)分并獲取參數(shù)的js代碼
- js星星評(píng)分效果
- JS實(shí)現(xiàn)帶提示的星級(jí)評(píng)分效果完整實(shí)例
- javascript實(shí)現(xiàn)五星評(píng)分功能
- js實(shí)現(xiàn)的星星評(píng)分功能函數(shù)
- javascript 星級(jí)評(píng)分效果(手寫(xiě))
- AngularJS實(shí)現(xiàn)星星等級(jí)評(píng)分功能
- JavaScript制作淘寶星級(jí)評(píng)分效果的思路
- css+html+js實(shí)現(xiàn)五角星評(píng)分
相關(guān)文章
jquery實(shí)現(xiàn)限制textarea輸入字?jǐn)?shù)的方法
這篇文章主要為大家詳細(xì)介紹了jquery實(shí)現(xiàn)限制textarea輸入字?jǐn)?shù)的方法，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2017-09-09
這篇文章主要介紹了jQuery中g(shù)et()方法用法,實(shí)例分析了get()方法返回匹配集合DOM元素的使用技巧,具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2014-12-12
Jquery EasyUI實(shí)現(xiàn)treegrid上顯示checkbox并取選定值的方法
這篇文章主要介紹了Jquery EasyUI實(shí)現(xiàn)treegrid上顯示checkbox并取選定值的方法的相關(guān)資料,需要的朋友可以參考下2016-04-04
jQuery表單對(duì)象屬性過(guò)濾選擇器實(shí)例詳解
這篇文章主要介紹了jQuery表單對(duì)象屬性過(guò)濾選擇器,結(jié)合實(shí)例形式詳細(xì)分析了jQuery針對(duì)表單元素進(jìn)行屬性過(guò)濾操作的具體實(shí)現(xiàn)技巧,需要的朋友可以參考下2016-09-09
Jqgrid設(shè)置全選(選擇)及獲取選擇行的值示例代碼
本篇文章主要介紹了Jqgrid設(shè)置全選(選擇)及獲取選擇行的值示例代碼。需要的朋友可以過(guò)來(lái)參考下，希望對(duì)大家有所幫助2013-12-12
jQuery動(dòng)態(tài)添加<input type="file">
有時(shí)候需要在頁(yè)面上允許用戶上傳多個(gè)文件，個(gè)數(shù)由用戶自己決定，個(gè)數(shù)多了也可以刪除，使用jQuery可以很簡(jiǎn)單的實(shí)現(xiàn)這個(gè)功能2016-04-04
jQuery EasyUI API 中文文檔 - NumberBox數(shù)字框
jQuery EasyUI API 中文文檔 - NumberBox數(shù)字框使用介紹，需要的朋友可以參考下。2011-10-10
jquery實(shí)現(xiàn)兼容瀏覽器的圖片上傳本地預(yù)覽功能
圖片上傳本地預(yù)覽功能代碼在網(wǎng)上可以搜索很多，但同時(shí)可以兼容瀏覽器的話就多了，本文有個(gè)不錯(cuò)的示例，感興趣的朋友可以參考下2013-10-10
jCallout 輕松實(shí)現(xiàn)氣泡提示功能
在提交表單前、焦點(diǎn)轉(zhuǎn)移后或者 keyup 時(shí)往往需要對(duì)輸入的文本就行檢驗(yàn)，如果輸入內(nèi)容不符合相關(guān)約定則要進(jìn)行提示或警告，有一個(gè)叫 jCallout 的插件可以輕松實(shí)現(xiàn)該功能，該插件基于 jQuery 使用，所以使用前需要添加引用 jQuery2013-09-09
jQuery循環(huán)滾動(dòng)新聞列表示例代碼
jquery實(shí)現(xiàn)點(diǎn)擊公告的上一條下一條來(lái)查看滾動(dòng)條，示例代碼如下，希望對(duì)大家有所幫助2014-06-06