Restricting alphabets and special characters entry in a textbox and allowing only numeric value entry using jquery
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("#tbx").addClass("tbxNumber");
});
$(function () {
$(".tbxNumber").bind("keypress", function (e) {
var keyCode = e.which ? e.which : e.keyCode
var result = (keyCode >= 48 && keyCode <= 57);
return result;
});
// Restricting the Paste into textbox
$(".tbxNumber").bind("paste", function (e) {
return false;
});
// Restricting the Cut from textbox
$(".tbxNumber").bind("cut", function (e) {
return false;
});
// Restricting the Copy from textbox
$(".tbxNumber").bind("copy", function (e) {
return false;
});
// Restricting the drag and drop any value into textbox
$(".tbxNumber").bind("drop", function (e) {
return false;
});
});
</script>
Example
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("#tbx").addClass("tbxNumber");
});
$(function () {
$(".tbxNumber").bind("keypress", function (e) {
var keyCode = e.which ? e.which : e.keyCode
var result = (keyCode >= 48 && keyCode <= 57);
return result;
});
// Restricting the Paste into textbox
$(".tbxNumber").bind("paste", function (e) {
return false;
});
// Restricting the Cut from textbox
$(".tbxNumber").bind("cut", function (e) {
return false;
});
// Restricting the Copy from textbox
$(".tbxNumber").bind("copy", function (e) {
return false;
});
// Restricting the drag and drop any value into textbox
$(".tbxNumber").bind("drop", function (e) {
return false;
});
});
</script>
<style>
.important {
font-weight: bold;
font-size: xx-large;
}
.blue {
color: blue;
}
</style>
</head>
<body>
<h2 class="test">This is a heading</h2>
<p class="test">This is a paragraph.</p>
<p>This is another paragraph.</p>
<input type="text" class="blue important" id="tbx"></input>
</body>
</html>
No comments:
Post a Comment