This JS script gives me an alertbox saying;
jQuery.UI.version = 1.0.2 --- Box Width: undefined
How can I select the #resizable
?
<head>
<title></title>
<link href="StyleSheet.css" rel="stylesheet" type="text/css" />
<script src="jquery-1.9.1.min.js" type="text/javascript"></script>
<script src="jquery-ui-1.10.2.custom.min.js" type="text/javascript"></script>
<style>
#resizable { width: 200px; height: 150px; padding: 5px; border: 1px solid red;}
</style>
<script>
$(function () {
var boxWidth = $('#resizable').attr('width');
alert("jQuery.UI.version = " + jQuery.ui.version + " --- Box Width: " + boxWidth);
});
</script>
</head>
<body>
<div id="resizable" class=">
<div id="title">
<h2>
The expanding box
</h2>
</div>
</div>
</body>
See here you don't have a attribute of width
:
<div id="resizable" class=">
this will surely crash and set to undefined
, var boxWidth = $('#resizable').attr('width');
There are two ways getting the width of an element like:
By the .width()
way:
$('#resizable').width();
and by .css()
way:
$('#resizable').css('width');
your selector $('#resizable').attr('width');
search for attribute width
in resizable which does not exists
i think you are asking for width()
try this
var boxWidth = $('#resizable').width(); //this gives you the width of resizable div
updated seeing comment
your code reads the attribute width of div <div id="resizable" class="asd">
..but see , there is no attribute called width in this div so it fails... doc to read more about attr()
your code will work if you add width in div like <div id="resizable" class="asd" width="30px">
...this will give you 30px
as alert...
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