0

我有一个宽度和高度应该相同的 div：

<div class="radior" id="ha" style="background-color: #006;" onClick='foo()'></div>

所以用 Javascript 我首先检查高度，然后想改变宽度<div>

function foo(){
    var innerHeight = document.getElementById('ha').offsetHeight;
    var ele = document.getElementsByClassName("radior");

    for (var i = 0, len = ele.length; i < len; i++){
       ele[i].style.width = innerHeight;
    }
}

但不知何故，它不会工作！我不明白！来自德国的问候，这里是小提琴的例子：

http://jsfiddle.net/TSk6y/1/

4

4 回答 4

4

你为什么不保持简单？你不需要 for 循环。只需直接寻址元素并附+"px"加到您的宽度声明。

<div class="radior" id="ha" style="background-color: #006;" onClick='foo(this)'></div>

function foo(that){
    var innerHeight = that.offsetHeight;
    that.style.width = innerHeight+"px";
}

甚至更短：

function foo(that){
    that.style.width = that.offsetHeight+"px";
}
于 2013-02-19T13:42:07.407 回答
3

就这样做

ele[i].style.width = innerHeight + "px";
于 2013-02-19T13:39:31.913 回答
2

尝试 ele[i].style.width = innerHeight+"px";

小提琴链接：http: //jsfiddle.net/opherv/57V5b/

于 2013-02-19T13:39:53.730 回答
1

这似乎对我有用 - 不知道为什么 jsFiddle 没有，但如果我将所有代码放入 .html 文件中，并在标准浏览器中运行（在此处使用 chrome），它就可以工作。我点击 div，它确实改变了宽度：

<html>
<head>
<style>
body,html {width:100%;
    height:100%;
}

.radior{
    width: 20%;
    height: 60%;
}
</style>
</head>
<body>
<div class="radior" id="ha" style="background-color: #006;" onClick="foo()"></div>
</body>
<script type="text/javascript">
function foo(){
    var innerHeight = document.getElementById('ha').offsetHeight;
    var ele = document.getElementsByClassName("radior");

    for (var i = 0, len = ele.length; i < len; i++){
    ele[i].style.width = innerHeight;
    }
}
</script>
</html>
于 2013-02-19T13:53:33.763 回答