If there is no selection, you can use the properties .selectionStart or .selectionEnd (with no selection they’re equal). var cursorPosition = $(‘#myTextarea’).prop(“selectionStart”); Note that this is not supported in older browsers, most notably IE8-. There you’ll have to work with text ranges, but it’s a complete frustration. I believe there is a library somewhere which … Read more
Just add in your CSS file textarea { resize: none; } Later (2019) edit: Related to this answer of mine and the rising number of GitHub code search results on resize: none declarations applied to textarea elements, I wrote some lines on why I think CSS resize none on textarea is bad for UX: Very … Read more
The glow effect is most-likely controlled by box-shadow. In addition to adding what Pavel said, you can add the box-shadow property for the different browser engines. textarea { border: none; overflow: auto; outline: none; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; resize: none; /*remove the resize handle on the bottom right*/ } You may also try … Read more
By HTML specifications, browsers are required to canonicalize line breaks in user input to CR LF (\r\n), and I don’t think any browser gets this wrong. Reference: clause 17.13.4 Form content types in the HTML 4.01 spec. In HTML5 drafts, the situation is more complicated, since they also deal with the processes inside a browser, … Read more
As far as I understood the idea of Ace, you shouldn’t make a textarea an Ace editor itself. You should create an additional div and update textarea using .getSession() function instead. html <textarea name=”description”/> <div id=”description”/> js var editor = ace.edit(“description”); var textarea = $(‘textarea[name=”description”]’).hide(); editor.getSession().setValue(textarea.val()); editor.getSession().on(‘change’, function(){ textarea.val(editor.getSession().getValue()); }); or just call textarea.val(editor.getSession().getValue()); only … Read more
Try this. var lines = $(‘textarea’).val().split(‘\n’); for(var i = 0;i < lines.length;i++){ //code here using lines[i] which will give you each line }
Try the following, not sure which will work for all browsers or the browser you are working with, but it would be best to try all: <textarea style=”overflow:auto”></textarea> Or <textarea style=”overflow:hidden”></textarea> …As suggested above You can also try adding this, I never used it before, just saw it posted on a site today: <textarea style=”resize:none”></textarea> … Read more
Generally you just need to add white-space: pre-line; whitespace trimmed to single whitespace or white-space: pre-wrap; all whitespace preserved to the element’s style (CSS), where you want your text rendered with line-breaks.
The best way to set/get the value of a textarea is the .val(), .value method. .text() internally uses the .textContent (or .innerText for IE) method to get the contents of a <textarea>. The following test cases illustrate how text() and .val() relate to each other: var t=”<textarea>”; console.log($(t).text(‘test’).val()); // Prints test console.log($(t).val(‘too’).text(‘test’).val()); // Prints too … Read more
To disable resizing completely: textarea { resize: none; } To allow only vertical resizing: textarea { resize: vertical; } To allow only horizontal resizing: textarea { resize: horizontal; } Or you can limit size: textarea { max-width: 100px; max-height: 100px; } To limit size to parents width and/or height: textarea { max-width: 100%; max-height: 100%; … Read more