我有简单的评论表格。我把char-counter。当我创建新评论时,一切正常。当我尝试编辑评论时,字符计数器不起作用。我尝试了Live Live(),但结果是一样的。编辑页面中的其他Js工作正常,只是这个keyup函数死了。我试图提醒看看密钥是否有效但没有响应。 这是我的代码:
HTML
<?php echo form_tag_for($form, '@comments',array('class' => 'nice'));?>
<?php echo $form->renderHiddenFields() ?>
<?php echo $form->renderGlobalErrors() ?>
<?php echo $form['_csrf_token']; ?>
<input type="hidden" name="comments[users_id]" id="comments_users_id" value="1" />
<input type="hidden" name="comments[tests_id]" id="comments_users_id" value="<?php echo $testId?>" />
<?php echo $form['comment']->renderError() ?>
<div class="count">remaining symbols : 250</div>
<div class="barbox"><div class="bar"></div></div>
<?php echo $form['comment']->render(array('class' => 'comments_comment')) ?>
<?php echo $form['captcha']->renderLabel(null,array('class' => 'label-login-down ')) ?>
<?php echo $form['captcha']->renderError() ?>
<?php echo $form['captcha']->render(array('class' => 'normal input-text ' , 'placeholder'=>"Въведете символите")) ?>
<input type="submit" name="addComment" value="Изпрати" />
</form>
jquery的
$(".comments_comment").keyup(function()
{
var box=$(this).val();
var main = box.length *100;
var value= (main / 250);
var count= 250 - box.length;
if(box.length <= 250)
{
if(box.length <=210)
{
$('.count').html('remaining symbols : '+count);
}
else
{
$('.count').html('<div class="commentAlertSymbols">remaining symbols : '+count+'</div>');
}
$('.bar').animate(
{
"width": value+'%',
}, 1);
}
else
{
$('.count').html('<div class="commentRedSymbols">remaining symbols : '+count+'</div>');
}
return false;
});
答案 0 :(得分:0)
看到实际的表单HTML输出而不是所有那些PHP帮助程序函数会很高兴,但我会试一试:
$('.comments_comment').keyup(function() {
// Get the number of characters, percent used, and number left
var $count = $('.count');
var chars = $(this).val().length;
var percent = (chars / 250) * 100;
var left = 250 - chars;
// Update the counter
$count.html('Remaining Symbols: ' + left);
// Add classes based on how many are left
if (chars > 210 && chars <= 250) {
$count.addClass('commentAlertSymbols');
} else if (chars > 250) {
$count.addClass('commentRedSymbols');
}
// Animate the bar
$('.bar').css({
width: chars <= 250 ? percent + '%' : '100%'
});
});
我让代码更干。另外,我将$('.bar').animate
行更改为$('.bar').css
,因为我没有看到在一秒钟内制作动画的点。
你可以在http://jsfiddle.net/KjTrj/看到一个有效的JSFiddle。