系统中有一个选择星级的功能，需求不是很复杂，所以没用插件，自己简单的写了一个js的实现
直接上代码：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title> New Document </title>
<meta name="Generator" content="EditPlus">
<meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">
<style>
.start_zyz{
cursor:pointer;
}
</style>
</head>
<body>
<script type="text/javascript">
<!--
function clickStart(index){
//★
clearStart();
// hide = index
for(var i=1;i<=index;i++){
var span = document.getElementById('start'+i);
//alert('span-->'+span)
span.innerHTML='★';
}
}
function clearStart(){
//★
// hide = index
for(var i=1;i<=8;i++){
var span = document.getElementById('start'+i);
span.innerHTML='☆';
}
}
//-->
</script>
<span onclick='clickStart(1)' id='start1' class='start_zyz'>☆</span>
<span onclick='clickStart(2)' id='start2' class='start_zyz'>☆</span>
<span onclick='clickStart(3)' id='start3' class='start_zyz'>☆</span>
<span onclick='clickStart(4)' id='start4' class='start_zyz'>☆</span>
<span onclick='clickStart(5)' id='start5' class='start_zyz'>☆</span>
<span onclick='clickStart(6)' id='start6' class='start_zyz'>☆</span>
<span onclick='clickStart(7)' id='start7' class='start_zyz'>☆</span>
<span onclick='clickStart(8)' id='start8' class='start_zyz'>☆</span>
</body>
</html>
相关推荐
【标题】"简单jQuery星级评分功能插件"是一款用于网页中的评分系统实现的JavaScript插件，它基于流行的jQuery库，能够轻松地为网站添加互动式的星级评分功能。这个插件设计简洁，易于集成，适用于博客评论、产品评价...
js实现的星级评论打分效果,比较简单，但是还算比较实用吧。分享一下 <span>js星级评论打分 <a href="javascript:;">1 <a href="javascript:;">2 <a href="javascript:;...
在本文中，我们将深入探讨如何在Vue.js框架中实现一个简单的星级评分功能。Vue.js是一个轻量级的前端JavaScript框架，以其灵活性、可维护性和学习曲线平缓而受到开发者的欢迎。实现星级评分功能是常见的用户界面交互...
本教程将详细讲解如何利用jQuery和PHP技术实现一个简单的星级评分功能。 首先，我们需要理解jQuery的作用。jQuery是一个JavaScript库，它简化了JavaScript的DOM操作、事件处理和动画设计。在星级评分系统中，jQuery...
以上两种方法都可以实现星星评分功能，第一种方法简单直观，适合静态图片资源已经准备好的情况；第二种方法则更加灵活和现代化，适合需要适应多种屏幕大小和设计需求的场景。在实际开发中，开发者可以根据具体需求和...
Bootstrap五星评分插件...总之，Bootstrap五星评分插件提供了一个简单易用且高度可定制的解决方案，用于在Web应用中实现评分功能。通过理解其基本用法和配置选项，你可以轻松地将其整合到自己的项目中，提升用户体验。
这样，我们就构建了一个简单的原生JavaScript星级评分系统，它不仅易于理解，而且可以根据需求进行扩展。无论是在网站还是应用程序中，这样的评分系统都能提供直观且友好的用户体验。通过不断优化和调整，我们可以使...
本文将深入探讨“星级评分JS”的实现原理、应用及其优化，结合淘宝等电商平台的评分系统，帮助开发者理解和创建自己的简洁、美观、高效的星级评分功能。 首先，星级评分JS的核心在于利用HTML、CSS和JavaScript来...
总的来说，PHP+MySQL+JQuery+CSS五角星评分功能的实现是一个涉及前端与后端交互的综合实践，它要求开发者具备多方面的技能，包括数据处理、数据库设计、前端交互和视觉设计。这样的功能不仅能够提升用户体验，也是...
本示例是关于如何使用JavaScript（JS）和Cascading Style Sheets（CSS）来实现一个简单的星级评分功能。这里我们将深入探讨如何利用这两种技术来创建这种交互式组件。 首先，`commstar.gif` 文件很可能是一个包含...
在JavaScript编程中，实现"五角星评分"的交互效果是一项常见的任务，特别是在网页的评论系统或者用户评价中。这个效果通常是指用户鼠标滑过五角星时，被滑过的星星会变亮，以显示用户当前选择的评分。下面将详细讲解...
- `half`: 是否支持半星，设置为`true`启用半星功能。 例如，设置初始评分为3.5星，且允许半星评分： ```javascript $('#star-rating').raty({ score: 3.5, half: true }); ``` ### 4. 动态改变评分 如果你...
本Demo是关于在ASP.NET中实现一个简单的评分星星功能，这种功能常见于用户评价系统中，让用户通过点击星星来表达对产品或服务的满意度。这个Demo的核心在于创建一个交互式的用户界面，使得鼠标悬停或点击时可以点亮...
"星级评分js源码" 提供了一种简便的方法来实现这种功能，无需复杂的后端支持，只需在前端进行处理。这个源码的核心是JavaScript语言，一种广泛用于网页动态效果和交互的脚本语言。 首先，让我们深入理解"星级评分js...
这个插件设计简洁，适用于那些希望快速实现评分功能而又不涉及复杂代码的开发者。由于它仅支持整颗星评分，因此并不提供半颗星选项，但其简易性使得代码易于理解和自定义。 首先，我们需要理解JQuery的基本概念。...
本项目名为"简易 js星星评分html代码"，主要展示了如何利用JavaScript、HTML和Bootstrap框架创建一个简单的星星评分功能。 首先，我们需要理解HTML是网页的基础结构语言，用于定义页面的布局和内容。在这个项目中，...
Raty是一款基于jQuery的开源插件，它使得在网页上实现自定义星级评分功能变得极其简单。 ### 1. Raty插件安装与引入 首先，你需要在项目中引入jQuery库和Raty的CSS及JS文件。Raty通常发布为压缩包，如"raty-2.5.2...
JavaScript实现星级评分是一种常见的用户界面交互，用于在线评价系统、评分反馈等场景。在这个示例中，我们将讨论如何使用JavaScript来创建一个简单的五星评级系统，当鼠标悬停在星星上时，可以动态显示用户选择的...