Menu
I am doing a bit of program in which whenever it detects an input change in the textbox it needs to do something. But it doesn't work for me. So i Change i started giving the value in console to verify it whenever it detects a change in input it always returns undefined. How can i get the size of the text a user has entered in pixels?
<!doctype html>
<html>
<head>
<style>
input[type=text] {
height: 20px;
width: 100px;
}
</style>
<script src="jquery.js"></script>
</head>
<body>
<input type="text" id="func"></input>
</body>
<script>
$("#func").change(function () {
console.log($("func").scrollWidth);
});
</script>
</html>
829
asked Jan 14 '16 10:01
You have two bugs in your code. First, you select the element func without a hash. If you select an id in jQuery, you are required to use a # in front of the id name (see reference). So, you need to select it like this: $('#func').
Second, you need the DOM element of $('#func') and not its jQuery wrapper to access the property scrollWidth. You can do that by using $('#func')[0].scrollWidth or $('#func').get().scrollWidth.
I would however recommend you to use the jQuery width function to get the width of the input field: $('#func').width().
176
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
