Disabled Space Bar When Cursor Inside Text Field

$(document).ready(function() { $('input.some_text_field').keydown(function(e) { if (e.keyCode == 32) { return false; } }); });
Disabled Space Bar When Cursor Inside Text Field just add or match the class at $('input.some_text_field').

3 Responses

Pure HTML version :)

<input type="text" pattern="\S+" required>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>

<limited-textarea maxchars="250"></limited-textarea>

<script>
class LimitedTextarea extends HTMLElement {
constructor(){
super();
this.attachShadow({mode:'open'});
this.maxLenght = this.getAttribute('max-length') || 200;
this.shadowRoot.innerHTML = `
<style>

</style>
<textarea></textarea>
<span id="counter"></span>
`;
this.textarea = this.shadowRoot.querySelector('textarea');
this.counter = this.shadowRoot.querySelector('#counter');
this.updateCoounter();
}
connectedCallback() {
this.textarea.addEventListener('input',()=>this.updateCoounter());
}
updateCoounter() {
const remaining = this.maxLenght - this.textarea.value.length;
this.counter.textContent = `${remaining} characters remaining`;
this.counter.style.color = remaining < 10? 'red' : 'black';
}
}
customElements.define('limited-textarea', LimitedTextarea);
</script>

</body>
</html>

Write a comment

You can use [html][/html], [css][/css], [php][/php] and more to embed the code. Urls are automatically hyperlinked. Line breaks and paragraphs are automatically generated.