In this tutorial, I'll teach you how to limit the length of comment. In some places on the web, you have seen that there are limit for comments word i-e 140 characters. The code i will provide you be the mixture of php and jquery.
Line 1: Initializing the jquery function, to load jquery.
Line 2: Save comments data in a variable
Line 3: Save submit button movement in a variable.
Line 4: Define a variable, where you define, how much characters should be displayed.
Line 5: This div will be appeared after submitting comment
Line 6: Bind the textarea when anyone will loose focus to the textarea.
Line 7: Check the length of the comment typed.
Line 8: Minus the comment typed length by the specific length.
Line 9: Displaying a span html element, where characters counting will be displayed.
Line 10: Making condition, if submit button is pressed
Line 11: Then if remaining characters are less than 0, then hide the submit button, else show submit button.
Line 12 and Line 13: Closing the jquery tags.
- jQuery(function($) {
- var input_comment = $( '#form textarea' );
- var submit = $( '#form .submit' );
- var comment_limit = 140;
- $( '<div class="limit_info"><span>' + comment_limit + '</span> left</div>' ).insertAfter( input_comment);
- input_comment.bind( 'keyup', function() {
- var length_of_comment = $(this).val().length;
- var left = comment_limit - length_of_comment;
- $( '.limit_info span' ).html( left );
- if (submit)
- ( left < 0 ) ? button.hide() : button.show();
- });
- });
Line 1: Initializing the jquery function, to load jquery.
Line 2: Save comments data in a variable
Line 3: Save submit button movement in a variable.
Line 4: Define a variable, where you define, how much characters should be displayed.
Line 5: This div will be appeared after submitting comment
Line 6: Bind the textarea when anyone will loose focus to the textarea.
Line 7: Check the length of the comment typed.
Line 8: Minus the comment typed length by the specific length.
Line 9: Displaying a span html element, where characters counting will be displayed.
Line 10: Making condition, if submit button is pressed
Line 11: Then if remaining characters are less than 0, then hide the submit button, else show submit button.
Line 12 and Line 13: Closing the jquery tags.
No comments:
Post a Comment