gongpex Posted April 3, 2018 Share Posted April 3, 2018 (edited) Hello everyone, On modern browser commonly we put : <input type="text" placeholder="Your Value" /> To display placeholder's value. But how about in old browser such IE7? I've tried to made own code used jquery and these my code : HTML : <input type="text" class="form-control placeholder" watermark="Your Name" id="name" /> JQUERY function placeholder(){ var holder = $(".placeholder"); var content_holder = holder.attr("watermark"); holder.val(content_holder); holder.focus(function(){ $(this).selectRange(0,0); }); holder.keyup(function(){ if(holder.val().length == 0){ holder.val(content_holder); $(this).selectRange(0,0); } }); holder.keypress(function(){ if(holder.val() == content_holder) { holder.val(""); } }); } $.fn.selectRange = function(start, end) { if(!end) end = start; return this.each(function() { if (this.setSelectionRange) { this.focus(); this.setSelectionRange(start, end); } else if (this.createTextRange) { var range = this.createTextRange(); range.collapse(true); range.moveEnd('character', end); range.moveStart('character', start); range.select(); } }); }; my codes as far runs well but still have flaw (not like as properly placeholder). if you clicked on input, the cursor position still able go to last character from ("your name"), not at position 0,0 (first character). Q : how to make so that the cursor position at range 0,0 (first character) / same as properly placeholder? please help me Thanks Edited April 3, 2018 by gongpex misspell Link to comment Share on other sites More sharing options...
justsomeguy Posted April 3, 2018 Share Posted April 3, 2018 When the element receives focus, check if the value of the element is the default placeholder value and, if so, set the value to empty. Do the opposite when the element loses focus. Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now