Question

这个JS脚本给了我一个警告说，

jQuery.UI.version = 1.0.2  ---   Box Width: undefined

如何选择#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>

Answer 1

您的选择器$('#resizable').attr('width');在不存在的可调整大小中搜索属性width

我认为你要求width()

试试这个

 var boxWidth = $('#resizable').width(); //this gives you the width of resizable div

更新了评论

您的代码会读取div <div id="resizable" class="asd">的属性宽度。但是请注意，此div中没有名为width的属性，因此它失败了... doc可以阅读有关attr()的更多信息

如果你在<div id="resizable" class="asd" width="30px">等div中添加宽度，你的代码就会有效...这会给你30px提醒......

Answer 2

请参见此处，您没有width的属性：

<div id="resizable" class=">

这肯定会崩溃并设置为undefined，var boxWidth = $('#resizable').attr('width');

有两种方法可以获得元素的宽度：

通过.width()方式：

$('#resizable').width();

和.css()方式：

$('#resizable').css('width');

Answer 3

试试这一点：

$('#resizable').width();

Answer 4

你没有该div的宽度属性，你试图获得div的width属性吗？试试

$("#resizable").width();

Answer 5

alert($('#resizable').width()); will you give 200

alert($('#resizable').css('width')); and this will you give 200px

div width

Answer 6

使用Pure JavaScript，您可以通过以下方式执行此操作：

document.getElementById('resizable').clientWidth;

当宽度由css类设置时获取div的宽度

6 个答案: