JQuery评分控件

青旅半醒 2022-05-31 09:47 229阅读 0赞

<!DOCTYPE html>

< html  lang = "en" >

< head >

< meta  charset = "UTF-8" >

< meta  name = "viewport"  content = "width=device-width, initial-scale=1.0" >

< meta  http-equiv = "X-UA-Compatible"  content = "ie=edge" >

< title >评分控件</ title >

< script  src = './jquery.js' > < / script >

< style >

li \{  *list-style* :  none ; *float* : left ; *width* : 30 px ;\}

< / style >

</ head >

< body >

< ul >

< li  class = "item" >☆</ li >

< li  class = "item" >☆</ li >

< li  class = "item" >☆</ li >

< li  class = "item" >☆</ li >

< li  class = "item" >☆</ li >

</ ul >

< script >

$ ( *function* ()\{

$ ( '.item' ). hover ( *function* ( *e* )\{

$ ( this ). text ( '★' ). prevAll (). text ( '★' );

\}, *function* ( *e* )\{

$ ( this ). text ( '☆' ). nextAll (). text ( '☆' );

\}). on ( 'click' , *function* ( *e* )\{

$ ( this ). addClass ( 'cur' ). siblings (). removeClass ( 'cur' ); //获取当前点击的li

\});

$ ( 'ul' ). on ( 'mouseleave' , *function* ( *e* )\{

$ ( 'ul li.cur' ). text ( '★' ). prevAll (). text ( '★' ). end (). nextAll (). text ( '☆' );

\});

\})

< / script >

</ body >

</ html >

发表评论取消回复

表情：

评论列表（有 0 条评论，229人围观）

还没有评论，来说两句吧...

相关阅读

相关（Jquery功能篇） Jquery 控件赋值

1.jQuery给span取值：$("\id").html(); 2.jQuery给input取值：$("\id").val(); 3.jQuery给textarea取值：

小鱼儿/ 2023年10月16日 20:34/ 0 赞/ 54 阅读

相关星星评分控件

import android.content.Context; import android.util.Log; import com.bai

喜欢ヅ旅行/ 2023年10月03日 18:16/ 0 赞/ 20 阅读

相关 jquery城市选择控件_jQuery选择插件

jquery城市选择控件 ![jQuery Chosen Plugin][] Without a doubt, my least favorite form element

╰+攻爆jí腚メ/ 2023年02月21日 14:25/ 0 赞/ 142 阅读

相关 Android自定义星星评分控件

下面为控件的实现历程：此控件高效，直接使用ondraw绘制，先亮照： ![这里写图片描述][20160718165223964]![这里写图片描述][20160718

亦凉/ 2022年12月04日 01:13/ 0 赞/ 355 阅读

相关 jQuery日历选取时间控件

[下载地址][Link 1]这个jQuery日历插件可以展示日历并监听点击事件，同时可以在input 框调用日期选择控件 ![1630441802.png][] dd:

柔光的暖阳◎/ 2022年09月09日 12:46/ 0 赞/ 224 阅读

相关 Jquery的TreeView控件工具

<html> <head> <title>ItcastOA</title> <meta http-equiv="Content-Type" co

Bertha 。/ 2022年06月14日 01:56/ 0 赞/ 299 阅读

相关 iOS- 非整星的评分控件(支持小数)

概述订单评论里实现星级评分控件: 简单整星评价与非整星的精评价. 详细代码下载：[http://www.demodashi.com/demo/10711.h

「爱情、让人受尽委屈。」/ 2022年05月31日 09:59/ 0 赞/ 162 阅读

相关 JQuery评分控件

<!DOCTYPE html> < html lang = "en" > < head > < meta charset = "UTF-8" > < meta

青旅半醒/ 2022年05月31日 09:47/ 0 赞/ 230 阅读

相关 jquery中文日期控件

前提：导入jquery-2.0.3.min.js，jquery-ui-1.10.3.full.min.js，jquery-ui-1.10.3.full.min.css

妖狐艹你老母/ 2022年04月21日 19:00/ 0 赞/ 272 阅读

相关 jQuery Raty - 不错的星级评分插件

在做商品评价时，一般情况下，我们需要一个星级评分的组件，而jQuery Raty恰好满足我们的需求。一、展示 ![图片描述][20160824084534980]

谁践踏了优雅/ 2021年09月11日 01:24/ 0 赞/ 371 阅读