for循环不工作两个id加变量

时间:2018-03-01 13:34:58

标签: javascript

您好,我正在努力为循环

<script>
  $(document).ready(function(){
  sizeNestable();
});

  for (p = 1; p <= 20; p++) { 

$('#nestable'+p+', #nestable'+(p+1)).change(function() {
   sizeNestable();
});




function sizeNestable() {
  var n3 = $('#nestable3').find('.dd3-handle').height('100%'); 
  var n4 = $('#nestable4').find('.dd3-handle').height('100%'); 


}
}

</script>

所以我需要的是

$('#nestable1, #nestable2').change(function() {

 var n3 = $('#nestable1).find('.dd3-handle').height('100%');

然后增加一个.. 我在这里做错了什么?

1 个答案:

答案 0 :(得分:0)

我不明白你要做的事情。但是我看到了一些错误。

函数sizeNestable不属于for循环。相反,你应该给函数一个参数,你应该在循环中调用该函数并将p(或其他东西)作为参数传递。

你的for循环不在函数内部,但它包含HTML元素。必须避免这种情况。 你应该远离HTML元素,直到document.ready。在函数中包含HTML是可以的,因为只有在调用它时才会执行函数。加载脚本后立即执行for循环,HTML可能尚未就绪。

我的代码包含您的代码段,请解释您要执行的操作。您在谈论哪种HTML元素?

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script>
  $(document).ready(function() {
    for (var p = 1; p <= 20; p++) { 
      var selector = '#nestable' + p ;
      $(selector).click(function() {
        sizeNestable(this); // inside this kind of function (triggered by an event) 'this' is whatever was triggered (in this case clicked on)
      });
    }
  });

  function sizeNestable(element) {
    $(element).find('.dd3-handle').css('height', '100%'); 
  }

</script>
<style>
.mydiv {
  height: 20px;
}
.dd3-handle {
  height: 3px; 
  overflow: hidden;
  float: left;
}
</style>
<div class="mydiv" id="nestable1">Hello <div class="dd3-handle">|||</div> </div>
<div class="mydiv" id="nestable2">World <div class="dd3-handle">|||</div> </div>
<div class="mydiv" id="nestable3">! <div class="dd3-handle">|||</div> </div>
<div class="mydiv" id="nestable4">foo <div class="dd3-handle">|||</div> </div>
<div class="mydiv" id="nestable5">bar <div class="dd3-handle">|||</div> </div>
<hr/>
<p>Click on one of the lines above.  hidden ||| elements will appear</p>