i have jquery code
$(window).load(function () { $('document').ready(function () { var text_max = "5000"; $('#ram').html(text_max + '/5000'); window.setinterval(function () { $("#post").attr("maxlength", "5000"); var text_length = $('#post').val().length; var text_remaining = text_max - text_length; if ($("#post").val().length < 4750) { $('#ram').html('<abbr title="you have ' + text_remaining + ' characters remaining in post" style="visibility: hidden;">' + text_remaining + '/5000</abbr>'); } else { $('#ram').html('<abbr title="you have ' + text_remaining + ' characters remaining in post">' + text_remaining + '/5000</abbr>'); } if ($("#post").val().length <= 5000) { $("#subm").removeattr("disabled"); } else { $("#subm").attr("disabled", "disabled"); } if ($("#post").val().length < 4980) { $("#ram").removeattr("style"); } else { $("#ram").attr("style", "color:#ff0000;"); } }); }); }); and html:
<form action='posting' method='post'><center><font color='#ff0000' style='style=font-family: sarala, sans-serif;display: inline-block;word-break: break-word;'></font><br><table><tr><td><textarea rows='15' cols='40' style='resize: none;max-width: 297px;max-height: 225px;width: 297px;height: 225px;' name='post' id='post' maxlength='5000' spellcheck='true' autofocus></textarea></center></td></tr><tr><td><div class='ram' id='ram' name='ram'><noscript><center>there 500 character limit on posts</center></noscript></div></td></tr></table></td></tr><tr><td><center><input type='submit' value='post!' class='subm' id='subm' name='subm'></center></td></tr></table></form> however want account appropriate value of textarea, because when press enter accounts 2 instead of 1. need value equal amount opposed unequal amount. there way of doing this, code below. or need redo it, if not @ jquery or javascript; need help??
thanks!!!
ok, there few things here.
first of all; can use keyup event (although it's beter use .on('keyup', handler) variant). because of you're looping endlessly, while don't want check everytime if user didn't anything, right?
furthermore; jquery(document).ready(); callback more enough, don't need wrap in jquery(window).load() callback.
then add/remove classes appropriate. makes lot easier maintain. rule of thumb, don't want add styling in scripts. that's css for.
i think little script want. checkout demo here.
jquery(document).ready(function ($) { // calculate remaining characters function charactersremaining() { var charactersallowed = $('input[name="characters-allowed"]').val(); return { allowed: charactersallowed, remaining: charactersallowed - $('textarea[name="post"]').val().length }; }; // stuff when calculated characters function updatecharactercount() { var charactercount = charactersremaining(); // update notifiers $('.characters-remaining').text(charactercount.remaining); $('.allowed-characters').text(charactercount.allowed); // update properties , classes if( charactercount.remaining < 0 ) { $('button.submit').prop('disabled', true); } else { $('button.submit').prop('disabled', false); } if( charactercount.remaining <= 0 ) { $('.character-count').addclass('overflow'); $('textarea[name="post"]').addclass('limit'); } else { $('.character-count').removeclass('overflow'); $('textarea[name="post"]').removeclass('limit'); } }; // register events form fields $('textarea[name="post"], input[name="characters-allowed"]').on('keyup', function() { updatecharactercount(); }); // little disallow typing of characters $('body').on('keydown', 'textarea[name="post"].limit', function(e) { var keycode = e.keycode || e.which; if( keycode !== 8 && keycode !== 46 ) { // allow backspace , delete button e.preventdefault(); } }); // initialize updatecharactercount(); }); please note; of typing limited, and post button disabled whenever characters overflow. sounds stupid, can still paste more allowed characters. build in function strips off characters. lazy that. can transform plugin if you'd like. lazy ;)
Comments
Post a Comment