I try to make a element via using contenteditable to submit some title, That way I want users type/paste title only one line.
$('.title').on('keypress',function(e) {
var code = e.keyCode || e.which;
if(code == 13) {
e.preventDefault();
}
}).on('paste',function(){
var text = $(this).text();
$(this).html(text).focus();
});
Problem is paste event, When I paste some text, I can't use .focus() to select/point text to the last charecter.
What I did wrong ?
I have idea now...
jQuery :
$('.title').on('keypress',function(e) {
var code = e.keyCode || e.which;
if(code == 13) {
e.preventDefault();
}
}).on('paste',function(){
$('br,p',this).replaceWith(' ');
});
CSS : (not request)
.title br {display:none;}
Related
I have a textarea and when click enter it doesn't insert a linebreak,
I tried to use the following code, But, when i press enter, it goes to the end fo text and add new line.
$("#descre").on('keydown', function(e) {
var code = e.keyCode || e.which;
if (code == 13) { //Enter keycode
event.preventDefault();
var s = $(this).val();
$(this).val(s + "\n");
}
});
I want to make a normal enter press, like ex: jsfiddle
My textarea was not working well, so to accept enter key press on normal behaviour i used the code:
$('#descre').keypress(function(e) {
if (e.keyCode == 13) {
e.preventDefault();
this.value = this.value.substring(0, this.selectionStart) + "" + "\n" + this.value.substring(this.selectionEnd, this.value.length);
}
});
You have passed e in the function as argument but in the if block you are doing event.preventDefault() change it to e.preventDefault()
//i try this one
$("#descre").on('keydown', function(e) {
var code = e.keyCode || e.which;
if(code == 13) { //Enter keycode
e.preventDefault();
var s = $(this).val();
$(this).val(s);
}
});
You are adding an extra line in the end yourself. Thats why it is inserting the extra k=line
I have a problem with Dropdown, which is connected to the database and I can't control arrows up and down to move result only mouse click.
See this is my code that I started writing but doesn't work.
What am I doing wrong?
$(field-customer-dropdown).on("keydown", function(event) {
var keyCode = event.which;
if (keyCode == 38 || keyCode == 40) {
showDropDown();
}
});
Edit:
As I made my little code currently looks like this:
$("body").on("keydown", function(event) {
var keyCode = event.which;
if (keyCode == 40) {
console.log("key");
$(".drop-down-row:firstchild").css("backgroundcolor","red");
}
});
And this is the result:
enter image description here
How should look like the code so that I could push keydown 40 switch from Data 1 on Data 2?
Can anyone help me?
JavaScript variables cannot contain - in them. Also, the selector you are using is not a HTML Tag, which doesn't have any prefix. If it's a class, prefix it with . else if it is an id, prefix it with a #.
$(".field-customer-dropdown").on("keydown", function(event) {
var keyCode = event.which;
if (keyCode == 38 || keyCode == 40) {
showDropDown();
}
});
I'm using a content editable div to try and make tags. When the user presses return, I need to be able to select the previous text (but not the previous tags) and turn it into a new tag. A tag will be wrapped in , so an example would be:
<em>tag1></em><em>tag2</em>tag3--- // about to press enter for tag3
This is what I'm thinking so far:
$('#tags').keydown(function(e) {
if (e.keyCode == 13 || e.which == 13) {
paste('---'); // this adds a separator when the user presses enter
var content = $(this).html();
var newTag = // the text between the last </em> and ---
newtag.wrapInEm(somehow);
event.preventDefault();
return false;
}
});
Maybe you should separate the current tags from the new tag creation.
HTML
<div id='tags'>
<span id='tag-list'></span>
<span id='tag-new' contenteditable></span>
</div>
JS
(function($){
var tags = ['tag1', 'tag2'];
$('#tag-new').on("keydown", function(e) {
e.preventDefault();
if (e.keyCode == 13 || e.which == 13) {
// if (!saveToDB) return;
tags.push($(this).text());
_renderTags();
return false;
}
});
$('#tag-list').on("click", "em", function(e){
// if (!deleteFromDB) return;
var idx = tags.indexOf($(this).html());
tags.splice(idx,1);
_renderTags();
});
function _renderTags(){
$('#tag-list').html("<em>" + tags.join("</em><em>") + "</em>");
}
$(document).ready(function(){
// loadTagsFromDB
_renderTags();
});
})(jQuery);
It's hard for me to understand your question--there are a handful of typos and your html sample doesn't make any sense.
Nevertheless:
How about using the [.wrap(]http://api.jquery.com/wrap/) jquery function?
$('#tags'.keydown(function(e) {
if (e.keyCode == 13 || e.which == 13) {
$([selector for previous text]).text().wrap(<em></em>);
}
});
I want to know the cursor position inside body tag.Actually I want if the cursor position is inside the span tag having class edit, then I want to prevent the cursor from jumping to new line on pressing Enter key. And if the cursor position is out of the span tag,then the cursor will jump to new line on pressing enter key. I would be greatly thankful to you if you provide the solution with an example.
I am not so strong in javascript.I know to stop the cursor jumping to new line. The code for this will be.
$('p').keydown(function(e){
e.preventDefault();
});
But in my case, prevention should be only if the cursor is inside the span tag.
Thanks in advance.
Try this:
var canPressEnter = true;
$("span.edit").on("focus", function(){
canPressEnter = false;
}).on("keypress", function(e){
var code = (e.keyCode ? e.keyCode : e.which);
if (canPressEnter === false && code === 13)
{
e.preventDefault();
}
}).on("blur", function(){
canPressEnter = true;
});
http://jsfiddle.net/hescano/S6hzY/
If you don't need the flag from somewhere else, this will do:
$("span.edit").on("keypress", function(e){
var code = (e.keyCode ? e.keyCode : e.which);
if (code === 13)
{
e.preventDefault();
}
});
http://jsfiddle.net/hescano/S6hzY/1/
This works for me:
tinyMCE.init({
theme : "advanced",
mode: "exact",
elements : "elm1",
setup : function(ed) {
ed.onInit.add(function(ed, evt) {
tinymce.dom.Event.add(ed.getDoc(), 'keydown', function(e) {
var existing = tinyMCE.get('elm1').getElement(e);
var code = (e.keyCode ? e.keyCode : e.which);
var spans = tinyMCE.activeEditor.getBody().getElementsByTagName("span");
if (spans.length > 0)
{
for (var i = 0; i < spans.length; i++)
{
if (spans[i].getAttribute("class") === "AMedit")
{
if (code === 13)
{
e.preventDefault();
}
}
}
}
});
});
},
themes...
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-.
Hope this may be helpful to you.
$('#myarea')[0].selectionStart; // return start index of cursor
I've got the following code:
document.onkeydown=function(e) {
if (e.which == 13 && isCtrl) {
log('Ctrl CR');
} else if (e.which == 17) {
isCtrl = true;
};
I need to insert a Carriage Return/Line feed where the cursor is located in the input textarea.
Now that I think about it, I should probably be using a textarea selector instead of document.onkeydown, but $('textarea').onkeydown doesn't work.
$('textarea').keydown(function (e){
var $this = $(this);
if (e.which === 13 && e.ctrlKey) {
$this.val($this.val() + '\r\n'); // untested code (to add CRLF)
}
});
Reference
.keydown
Event object