如何在javascript函數中使用for循環

我在圖像中創建了幾個地圖區域。我想要顯示特定區域的描述。我使用了一個JavaScript函數。圖像包含大約15-20個地圖區域。以下是僅三個區域的簡單功能。這個工作正常。如何在javascript函數中使用for循環

function showdiv(id) { 
       obj = document.getElementById(id); 
       alert(obj); 

       if (obj.style.display == 'block') { 
        obj.style.display = 'none'; 
       } 
       if (obj.style.display == 'none') { 
        if (obj == whatever1) { 
         whatever1.style.display = 'block'; 
         whatever2.style.display = 'none'; 
         whatever3.style.display = 'none'; 
        } else if (obj == whatever2) { 
         whatever2.style.display = 'block'; 
         whatever1.style.display = 'none'; 
         whatever3.style.display = 'none'; 
        } else if (obj == whatever3) { 
         whatever3.style.display = 'block'; 
         whatever2.style.display = 'none'; 
         whatever1.style.display = 'none'; 
        } 
       } 
      }

我認爲這是對15個以上地圖區域不公平的方法。所以我試圖使用for循環。但是出了點問題。

<script> 
       function showdiv(id) { 
        obj = document.getElementById(id); 
        if (obj.style.display == 'block') { 
         obj.style.display = 'none'; 
        } 
        if (obj.style.display == 'none') { 
         for (var i=0; i<=12; i++) { 
          var div = whatever + i; 
          if (div == obj) { 
           div.style.display = 'block'; 
           home.style.display = 'none'; 
          } else { 
           div.style.display = 'none'; 
          } 
         } 
        } 
       } 
</script>

這個基本問題的解決方案是什麼？任何人有任何建議？提前謝謝你。

來源

2015-03-13 RAWhoLovesMusic

'var div = whatever + i;' - 我在變量'div'中假設您期待DOM元素？這不會發生在那個聲明 – CodingIntrigue 2015-03-13 08:14:02

我建議你總結你的所有wahtever元素帶班。即：

<div id="whatever1" class="whateverElement"/>

然後在你的功能，你可以處理他們都是一樣的：

function showdiv(id) { 
     obj = document.getElementById(id); 
     var isBlock = (obj.style.display == 'block'); 

     //first change all elments 
     var allElements = document.getElementsByClassName("whateverElement"); 

     for(var e in allElements){ 
      var element = allElements[e]; 
      element.style.display = "none"; 
     } 

     //now change the value for the object with the given id 
     if (isBlock) { 
      obj.style.display = 'none'; 
     } else { 
      obj.style.display = 'block'; 
     } 
}

只是爲了表明它可能是值得擁有看看「jQuery的」這樣的任務，下面的代碼會做同樣的使用jQuery以上：

function showdiv(id) { 
    $(".whateverElement").hide(); 
    $("#" + id).show(); 
}

來源

2015-03-13 08:22:14 Chris

非常感謝你的時間克里斯 – RAWhoLovesMusic 2015-03-13 08:33:46

如果whatever是string那麼你可以做如下：

var whatever = whatever+i; 
var div = $(whatever); 
alert(div); 
if (div == obj) { 
//.....your code continue.......

來源

2015-03-13 08:17:51 Mahesh

必須通過

div = document.getElementById("whatever" + i);

讓你的元素

然後像你這樣管理它...

來源

2015-03-13 08:22:21

如何在javascript函數中使用for循環

回答

相關問題