当前位置：首页 > 下载站 > js特效 > html5特效 > 简洁的H5星级评论表单代码

简洁的H5星级评论表单代码

分类: js特效 / html5特效	发布时间: 2018-01-24	访问量: 2392
下载量: 58

点击下载预览效果

更多>

最新下载

app网页步骤引导实例代码

jQuery tourguide.js 插件制作手机网页步骤引导提示，遮罩弹窗步骤引导介绍使用，支持下一步提示效果。可用于手机app，新版手机端页面使用步骤引导特效。

0 2026-01-02

简洁实用的jQuery表单验证代码

简洁实用的jQuery表单验证代码是一款适合网站做用户注册表单特效。

0 2026-01-02

CSS3悬停遮罩显示文字特效

CSS3悬停遮罩显示文字特效，总共有3款图片悬停遮罩文字效果，分别为圆形图片，六角形图片，五角形图片悬停遮罩动画特效。

0 2026-01-02

CSS3点击图片切换到下一张代码

纯CSS3铁轨上列车动画特效是一款点击第一张图片切换下一张图片展示特效。适用于手机端图片查看下一张代码。

0 2026-01-02

带网上开户表单jQuery焦点图

带网上开户表单jQuery焦点图是一款适合证券公司的带表单的图片左右滚动切换特效代码。

0 2026-01-02

社交图文卡片ui响应式布局

一款简洁响应式的社交图文列表，图文介绍卡片式ui布局代码。可用于相册图片，产品图片介绍展示特效。

0 2026-01-02

24小时阅读排行榜

更多>

最新教程

最新Python教程从入门到精通

Node.js 教程

14934 2025-08-28
CSS3 教程

1542777 2025-08-27
Rust 教程

22451 2025-08-27
Vue 教程

24893 2025-08-22
PostgreSQL 教程

21565 2025-08-21
Git 教程

8616 2025-08-21

简洁的H5星级评论表单代码

这是一款十分简洁的带有星级评论按钮，美化textarea评论表单代码，jQuery星级评论表单代码，jQuery星星打分特效。

js代码
<script type="text/javascript">
$(function () {

$('.text-area-input').click(function () {
if ($(this).val() == '请输入评论内容......') {
$(this).css({
color: '#000000'
}).val('')
}
});

//离开的时候
$('.text-area-input').blur(function () {
var iNum = $(this).val().length;
var fixedLength = 20;//固定长度
if (iNum < fixedLength) {
$('.text-area-input-length span').html(fixedLength - iNum);
} else {
$(this).val($(this).val().substr(0, fixedLength - 1));//截取长度
$('.text-area-input-length span').html(iNum - fixedLength);
}
});

//按下的时候
$('.text-area-input').keydown(function () {
var iNum = $(this).val().length;
var fixedLength = 20;//固定长度
if (iNum < fixedLength) {
$('.text-area-input-length span').html(fixedLength - iNum);
} else {
$(this).val($(this).val().substr(0, fixedLength - 1));//截取长度
$('.text-area-input-length span').html(iNum - fixedLength);
}
});

$('.text-area-bottom a').click(function () {
var star = $('input[name=star]:checked').val();
var content = $('textarea[name=content]').val();
alert(content);
});

$('.text-area-star label').click(function () {
var labelLength = $('.text-area-star label').length;
for (var i = 0; i < labelLength; i++) {
if (this == $('.text-area-star label').get(i)) {
$('.text-area-star label').eq(i).addClass('red');
} else {
$('.text-area-star label').eq(i).removeClass('red');
}
}
});

});
</script>