javascript oninput: press onekey multiple event fired
i'm just starting a typing text project not for english typing text. it's only for Bengali language. my typing project is 99% done for english language but in Bengali language i found a tiny but a big problem.
i have a input box that will match all the word one by one. you type a word and press space it will check the word for matching and after that move for the next word. it's work fine.
how i check that:in inputbox oninput event event.data === " " than move to the next word.
but in Bengali language when i press the key "c" (not as first character but in the middle of word first character) its fired the oninput event multiple time. with various event.data value include the space also. that's why when press c in keyboard its just go to the next word.
now you cannot find out the multiple event in the console because you don't have the software in your machine. so for that i include a screen short of this:
see_the_picture_for_butter_understanding
onkeyup event problem: see_the_picture
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<style>
@font-face {
font-family: 'SutonnyMj';
src: url('assets/fonts/SutonnyMj.ttf'),
url('assets/fonts/sutonnymj.woff2') format('woff2'),
url('assets/fonts/sutonnymj.woff') format('woff');
font-weight: normal;
font-style: normal;
}
#textbox {
width: 200px;
height: 200px;
font-family: 'SutonnyMj';
font-size: 50px;
}
</style>
<body>
<textarea id="textbox" type="text"></textarea>
<script>
var textBox = document.getElementById("textbox");
textBox.oninput = function(e) {
console.log(event); // multiple event fire when the Software is Enable
if(event.data === " ") {
// move_to_the_next_word();
}
}
</script>
</body>
</html>
Notes: It's happen because i use a software called Bijoy Bangla for writing Bengali. (It's require for Bengali Typing Test)
javascript
add a comment |
i'm just starting a typing text project not for english typing text. it's only for Bengali language. my typing project is 99% done for english language but in Bengali language i found a tiny but a big problem.
i have a input box that will match all the word one by one. you type a word and press space it will check the word for matching and after that move for the next word. it's work fine.
how i check that:in inputbox oninput event event.data === " " than move to the next word.
but in Bengali language when i press the key "c" (not as first character but in the middle of word first character) its fired the oninput event multiple time. with various event.data value include the space also. that's why when press c in keyboard its just go to the next word.
now you cannot find out the multiple event in the console because you don't have the software in your machine. so for that i include a screen short of this:
see_the_picture_for_butter_understanding
onkeyup event problem: see_the_picture
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<style>
@font-face {
font-family: 'SutonnyMj';
src: url('assets/fonts/SutonnyMj.ttf'),
url('assets/fonts/sutonnymj.woff2') format('woff2'),
url('assets/fonts/sutonnymj.woff') format('woff');
font-weight: normal;
font-style: normal;
}
#textbox {
width: 200px;
height: 200px;
font-family: 'SutonnyMj';
font-size: 50px;
}
</style>
<body>
<textarea id="textbox" type="text"></textarea>
<script>
var textBox = document.getElementById("textbox");
textBox.oninput = function(e) {
console.log(event); // multiple event fire when the Software is Enable
if(event.data === " ") {
// move_to_the_next_word();
}
}
</script>
</body>
</html>
Notes: It's happen because i use a software called Bijoy Bangla for writing Bengali. (It's require for Bengali Typing Test)
javascript
Welcome to StackOverflow!. Please note thatoninput
event is fired after each and every change that occurs in the textarea. So it is normal to execute when you type any character. w3schools.com/jsref/event_oninput.asp
– Ahmad
Nov 26 '18 at 7:42
add a comment |
i'm just starting a typing text project not for english typing text. it's only for Bengali language. my typing project is 99% done for english language but in Bengali language i found a tiny but a big problem.
i have a input box that will match all the word one by one. you type a word and press space it will check the word for matching and after that move for the next word. it's work fine.
how i check that:in inputbox oninput event event.data === " " than move to the next word.
but in Bengali language when i press the key "c" (not as first character but in the middle of word first character) its fired the oninput event multiple time. with various event.data value include the space also. that's why when press c in keyboard its just go to the next word.
now you cannot find out the multiple event in the console because you don't have the software in your machine. so for that i include a screen short of this:
see_the_picture_for_butter_understanding
onkeyup event problem: see_the_picture
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<style>
@font-face {
font-family: 'SutonnyMj';
src: url('assets/fonts/SutonnyMj.ttf'),
url('assets/fonts/sutonnymj.woff2') format('woff2'),
url('assets/fonts/sutonnymj.woff') format('woff');
font-weight: normal;
font-style: normal;
}
#textbox {
width: 200px;
height: 200px;
font-family: 'SutonnyMj';
font-size: 50px;
}
</style>
<body>
<textarea id="textbox" type="text"></textarea>
<script>
var textBox = document.getElementById("textbox");
textBox.oninput = function(e) {
console.log(event); // multiple event fire when the Software is Enable
if(event.data === " ") {
// move_to_the_next_word();
}
}
</script>
</body>
</html>
Notes: It's happen because i use a software called Bijoy Bangla for writing Bengali. (It's require for Bengali Typing Test)
javascript
i'm just starting a typing text project not for english typing text. it's only for Bengali language. my typing project is 99% done for english language but in Bengali language i found a tiny but a big problem.
i have a input box that will match all the word one by one. you type a word and press space it will check the word for matching and after that move for the next word. it's work fine.
how i check that:in inputbox oninput event event.data === " " than move to the next word.
but in Bengali language when i press the key "c" (not as first character but in the middle of word first character) its fired the oninput event multiple time. with various event.data value include the space also. that's why when press c in keyboard its just go to the next word.
now you cannot find out the multiple event in the console because you don't have the software in your machine. so for that i include a screen short of this:
see_the_picture_for_butter_understanding
onkeyup event problem: see_the_picture
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<style>
@font-face {
font-family: 'SutonnyMj';
src: url('assets/fonts/SutonnyMj.ttf'),
url('assets/fonts/sutonnymj.woff2') format('woff2'),
url('assets/fonts/sutonnymj.woff') format('woff');
font-weight: normal;
font-style: normal;
}
#textbox {
width: 200px;
height: 200px;
font-family: 'SutonnyMj';
font-size: 50px;
}
</style>
<body>
<textarea id="textbox" type="text"></textarea>
<script>
var textBox = document.getElementById("textbox");
textBox.oninput = function(e) {
console.log(event); // multiple event fire when the Software is Enable
if(event.data === " ") {
// move_to_the_next_word();
}
}
</script>
</body>
</html>
Notes: It's happen because i use a software called Bijoy Bangla for writing Bengali. (It's require for Bengali Typing Test)
javascript
javascript
edited Nov 26 '18 at 9:23
kundefine
asked Nov 26 '18 at 7:35
kundefinekundefine
12
12
Welcome to StackOverflow!. Please note thatoninput
event is fired after each and every change that occurs in the textarea. So it is normal to execute when you type any character. w3schools.com/jsref/event_oninput.asp
– Ahmad
Nov 26 '18 at 7:42
add a comment |
Welcome to StackOverflow!. Please note thatoninput
event is fired after each and every change that occurs in the textarea. So it is normal to execute when you type any character. w3schools.com/jsref/event_oninput.asp
– Ahmad
Nov 26 '18 at 7:42
Welcome to StackOverflow!. Please note that
oninput
event is fired after each and every change that occurs in the textarea. So it is normal to execute when you type any character. w3schools.com/jsref/event_oninput.asp– Ahmad
Nov 26 '18 at 7:42
Welcome to StackOverflow!. Please note that
oninput
event is fired after each and every change that occurs in the textarea. So it is normal to execute when you type any character. w3schools.com/jsref/event_oninput.asp– Ahmad
Nov 26 '18 at 7:42
add a comment |
2 Answers
2
active
oldest
votes
As mentioned by @Ahmad 'input' event is fired after each change, but you can be more specific using 'keyup' event which will provide you more control and attributes for event
object. For example you will be able to handle 'Space' using event.which
statement. Here an example:
var textBox = document.getElementById("textbox");
textBox.onkeyup = function(e) {
console.log(event);
if(event.which === 32) { //space keycode
// move_to_the_next_word();
}
}
cannot use keyup event. but i use this for testing purpose it also return event.which === 32 when i press c in the keyboard because its returning the space which has value of event.which = 32.
– kundefine
Nov 26 '18 at 8:01
Sorry, didn't understood which key you pressed for the same keycode? Also you are restricted to use onlyoninput
event? Why?
– dganenco
Nov 26 '18 at 8:06
now you will understand what i trying to said see the picture i.stack.imgur.com/IhpQl.jpg
– kundefine
Nov 26 '18 at 9:25
add a comment |
Try this!
function runScript(e) {
if (e.keyCode == 67) {//c
console.log("you have entred 'c' char")
}
if(e.keyCode == 32){//space
console.log("space ")
}
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<input id="scriptBox" type="text" onkeyup="return runScript(event)" />
add a comment |
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53476534%2fjavascript-oninput-press-onekey-multiple-event-fired%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
2 Answers
2
active
oldest
votes
2 Answers
2
active
oldest
votes
active
oldest
votes
active
oldest
votes
As mentioned by @Ahmad 'input' event is fired after each change, but you can be more specific using 'keyup' event which will provide you more control and attributes for event
object. For example you will be able to handle 'Space' using event.which
statement. Here an example:
var textBox = document.getElementById("textbox");
textBox.onkeyup = function(e) {
console.log(event);
if(event.which === 32) { //space keycode
// move_to_the_next_word();
}
}
cannot use keyup event. but i use this for testing purpose it also return event.which === 32 when i press c in the keyboard because its returning the space which has value of event.which = 32.
– kundefine
Nov 26 '18 at 8:01
Sorry, didn't understood which key you pressed for the same keycode? Also you are restricted to use onlyoninput
event? Why?
– dganenco
Nov 26 '18 at 8:06
now you will understand what i trying to said see the picture i.stack.imgur.com/IhpQl.jpg
– kundefine
Nov 26 '18 at 9:25
add a comment |
As mentioned by @Ahmad 'input' event is fired after each change, but you can be more specific using 'keyup' event which will provide you more control and attributes for event
object. For example you will be able to handle 'Space' using event.which
statement. Here an example:
var textBox = document.getElementById("textbox");
textBox.onkeyup = function(e) {
console.log(event);
if(event.which === 32) { //space keycode
// move_to_the_next_word();
}
}
cannot use keyup event. but i use this for testing purpose it also return event.which === 32 when i press c in the keyboard because its returning the space which has value of event.which = 32.
– kundefine
Nov 26 '18 at 8:01
Sorry, didn't understood which key you pressed for the same keycode? Also you are restricted to use onlyoninput
event? Why?
– dganenco
Nov 26 '18 at 8:06
now you will understand what i trying to said see the picture i.stack.imgur.com/IhpQl.jpg
– kundefine
Nov 26 '18 at 9:25
add a comment |
As mentioned by @Ahmad 'input' event is fired after each change, but you can be more specific using 'keyup' event which will provide you more control and attributes for event
object. For example you will be able to handle 'Space' using event.which
statement. Here an example:
var textBox = document.getElementById("textbox");
textBox.onkeyup = function(e) {
console.log(event);
if(event.which === 32) { //space keycode
// move_to_the_next_word();
}
}
As mentioned by @Ahmad 'input' event is fired after each change, but you can be more specific using 'keyup' event which will provide you more control and attributes for event
object. For example you will be able to handle 'Space' using event.which
statement. Here an example:
var textBox = document.getElementById("textbox");
textBox.onkeyup = function(e) {
console.log(event);
if(event.which === 32) { //space keycode
// move_to_the_next_word();
}
}
answered Nov 26 '18 at 7:47
dganencodganenco
22118
22118
cannot use keyup event. but i use this for testing purpose it also return event.which === 32 when i press c in the keyboard because its returning the space which has value of event.which = 32.
– kundefine
Nov 26 '18 at 8:01
Sorry, didn't understood which key you pressed for the same keycode? Also you are restricted to use onlyoninput
event? Why?
– dganenco
Nov 26 '18 at 8:06
now you will understand what i trying to said see the picture i.stack.imgur.com/IhpQl.jpg
– kundefine
Nov 26 '18 at 9:25
add a comment |
cannot use keyup event. but i use this for testing purpose it also return event.which === 32 when i press c in the keyboard because its returning the space which has value of event.which = 32.
– kundefine
Nov 26 '18 at 8:01
Sorry, didn't understood which key you pressed for the same keycode? Also you are restricted to use onlyoninput
event? Why?
– dganenco
Nov 26 '18 at 8:06
now you will understand what i trying to said see the picture i.stack.imgur.com/IhpQl.jpg
– kundefine
Nov 26 '18 at 9:25
cannot use keyup event. but i use this for testing purpose it also return event.which === 32 when i press c in the keyboard because its returning the space which has value of event.which = 32.
– kundefine
Nov 26 '18 at 8:01
cannot use keyup event. but i use this for testing purpose it also return event.which === 32 when i press c in the keyboard because its returning the space which has value of event.which = 32.
– kundefine
Nov 26 '18 at 8:01
Sorry, didn't understood which key you pressed for the same keycode? Also you are restricted to use only
oninput
event? Why?– dganenco
Nov 26 '18 at 8:06
Sorry, didn't understood which key you pressed for the same keycode? Also you are restricted to use only
oninput
event? Why?– dganenco
Nov 26 '18 at 8:06
now you will understand what i trying to said see the picture i.stack.imgur.com/IhpQl.jpg
– kundefine
Nov 26 '18 at 9:25
now you will understand what i trying to said see the picture i.stack.imgur.com/IhpQl.jpg
– kundefine
Nov 26 '18 at 9:25
add a comment |
Try this!
function runScript(e) {
if (e.keyCode == 67) {//c
console.log("you have entred 'c' char")
}
if(e.keyCode == 32){//space
console.log("space ")
}
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<input id="scriptBox" type="text" onkeyup="return runScript(event)" />
add a comment |
Try this!
function runScript(e) {
if (e.keyCode == 67) {//c
console.log("you have entred 'c' char")
}
if(e.keyCode == 32){//space
console.log("space ")
}
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<input id="scriptBox" type="text" onkeyup="return runScript(event)" />
add a comment |
Try this!
function runScript(e) {
if (e.keyCode == 67) {//c
console.log("you have entred 'c' char")
}
if(e.keyCode == 32){//space
console.log("space ")
}
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<input id="scriptBox" type="text" onkeyup="return runScript(event)" />
Try this!
function runScript(e) {
if (e.keyCode == 67) {//c
console.log("you have entred 'c' char")
}
if(e.keyCode == 32){//space
console.log("space ")
}
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<input id="scriptBox" type="text" onkeyup="return runScript(event)" />
function runScript(e) {
if (e.keyCode == 67) {//c
console.log("you have entred 'c' char")
}
if(e.keyCode == 32){//space
console.log("space ")
}
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<input id="scriptBox" type="text" onkeyup="return runScript(event)" />
function runScript(e) {
if (e.keyCode == 67) {//c
console.log("you have entred 'c' char")
}
if(e.keyCode == 32){//space
console.log("space ")
}
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<input id="scriptBox" type="text" onkeyup="return runScript(event)" />
edited Nov 26 '18 at 9:41
answered Nov 26 '18 at 9:35
the_ultimate_developerthe_ultimate_developer
1,020822
1,020822
add a comment |
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53476534%2fjavascript-oninput-press-onekey-multiple-event-fired%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Welcome to StackOverflow!. Please note that
oninput
event is fired after each and every change that occurs in the textarea. So it is normal to execute when you type any character. w3schools.com/jsref/event_oninput.asp– Ahmad
Nov 26 '18 at 7:42