Javascript删除onclick

时间:2013-11-08 23:15:51

标签: javascript html css javascript-events

我在我的html代码中设置了一边。我已经创建了一个允许我更改宽度的javascript,当我再次单击旁边减小宽度时。但是,当我撇开两次,那么什么都不会发生。这是行不通的。请找到解决此问题的方法。 我希望通过首先单击宽度更改旁边,然后第二次单击减小宽度。

FIDDLE

这是我的剧本:

<aside id="aside">
  <div id="click">
    <li>
    </li>
  </div>
</aside>

JS:

var next = document.getElementById('click');
next.addEventListener('click', function() {
  if (document.getElementById('aside').style.width = "35px"){
    document.getElementById('aside').style.width = "55%";
    document.getElementById('click').style.height = "calc(100% - px)";
    document.getElementById('click').style.marginTop = "-1px";
    document.getElementById('click').style.paddingLeft = "7px";
    document.getElementById('click').style.cssFloat = "right";
    document.getElementById('aside').style.WebkitTransition = 'width 1s';
    document.getElementById('aside').style.MozTransition = 'width 1s';
    document.getElementById('image').style.marginLeft = "-5px";
    var img = document.getElementById("image");
    img.setAttribute("class", "rotated-image");
  }
}, false);

window.addEventListener('click', function() {
  if (document.getElementById('aside').style.width == "55%"){
    document.getElementById('aside').style.width = "35px";
  }
});

抱歉我的英文。

3 个答案:

答案 0 :(得分:0)

if (document.getElementById('aside').style.width = "55%"){

应该是

if (document.getElementById('aside').style.width == "55%"){

注意要比较的两个等号,而不是分配。

答案 1 :(得分:0)

问题是当你第一次点击元素时,这个调用next.addEventListener('click', function() {并且当这个函数完成时,下一个函数也被调用window.addEventListener('click', function() {所以...它返回到原始大小< / p>

答案 2 :(得分:0)

我没有你可爱的帮助就解决了我的问题:

解决方案:

<强> FIDDLE

感谢您的帮助*讽刺