2013-09-15 3 views
-2

Я новичок в javascript, поэтому я не могу понять значение " + objID +", а затем приходит это.Не понимаю «+ objID +»

timer[objID]=setTimeout(m,150); 

Вот и весь код. При необходимости вы можете скопировать/вставить его в свой редактор, чтобы увидеть результат. Благодаря!

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> 
    <html> 
    <head> 
     <title>TEXT</title> 
     <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 
     <style type="text/css">  **/*the css */** 
      html, body { margin: 0px; padding: 0px; } 
      h1 { margin-top: 30px } 
      #menu a, .subMenu a { 
       display: block; 
       font-family: Arial, sans-serif; 
       font-size: 10pt; 
       font-weight: bold; 
       text-decoration: none; 
       color: black; 
       border: 1px solid #ddd;      
      } 
      #menu a:hover, #menu a:active, .subMenu a:hover, .subMenu a:active { 
       background-color: #eee; 
       border-color: #999; 
      }  
      #menu { 
       background-color: #ddd; 
       position: absolute; 
       top: 0px; 
       left: 0px; 
       width: 100%; 
      } 
      #menu a { 
       width: 100px; 
       float: left; 
       margin-left: 5px; 
       padding: 2px; 
      } 
      .subMenu { 
       width: 150px; 
       top: 26px; 
       background-color: #ddd; 
       border: 1px solid black; 
       position: absolute; 
       visibility: hidden; 
      } 
      .subMenu a { 
       display: block; 
       width: 90%; 
       margin: 0px; 
       padding: 4px; 
      } 
      #subMenu1 { left: 5px } 
      #subMenu2 { left: 125px } 
      #subMenu3 { left: 230px } 

     </style> **/*the css ends*/** 

        <script type="text/javascript"> 
      var timer= new Object(); 

      **/* this func. sets the visibility 
      of hidden menus which appear by 
      "onmouseover"*/** 

      function setVisibility(objID, visible){ 
      var obj=document.getElementById(objID); 
      if(obj.style.visibility=visible){ 
       obj.style.visibility="visible"; 
      } 
      else{obj.style.visibility="";} 

      } 

      **/* this one calls the func. above 
      if needed to show the hidden 
      menu*/** 

      function showMenu(objID) 
      { setVisibility(objID,true); 
       clearTimeout(timer[objID]); 
      } 
      **/*this one hides by onmouseout putting false boolean in func.       
        setVisibility "visible" parameter*/** 
      function hideMenu(objID) 
      { 
       var m="setVisibility('"+objID+"',false)"; 
       timer[objID]=setTimeout(m,150); 
      } 


     </script> 
    </head> 

    <body> 
     <h1>Text</h1> 
     <div id="menu"> 
      <a href="#" 
       onmouseover="showMenu('subMenu1')" 
       onmouseout="hideMenu('subMenu1')">Module 1</a> 
      <a href="#" 
       onmouseover="showMenu('subMenu2')" 
       onmouseout="hideMenu('subMenu2')">Module 2</a> 
      <a href="#" 
       onmouseover="showMenu('subMenu3')" 
       onmouseout="hideMenu('subMenu3')">Module 3</a> 
     </div> 

     <div id="subMenu1" class="subMenu" 
     onmouseover="showMenu('subMenu1')" 
       onmouseout="hideMenu('subMenu1')"> 
      <a href="../module1/statements/for-1.html">Text</a> 
      <a href="../module1/statements/if-1.html">Text</a> 
      <a href="../module1/statements/switch.html">Text</a>  
     </div> 

     <div id="subMenu2" class="subMenu" 
     onmouseover="showMenu('subMenu2')" 
       onmouseout="hideMenu('subMenu2')"> 
      <a href="../module2/objects/build-in/array.html">Text</a> 
      <a href="../module2/objects/build-in/boolean.html">Text</a> 
      <a href="../module2/objects/build-in/date.html">Text</a> 
      <a href="../module2/objects/build-in/global-object.html">Text</a> 
      <a href="../module2/objects/build-in/math.html">Text</a> 
      <a href="../module2/objects/build-in/number.html">Text</a> 
     </div> 
     <div id="subMenu3" class="subMenu" 
     onmouseover="showMenu('subMenu3')" 
       onmouseout="hideMenu('subMenu3')"> 
      <a href="../module3/document.html">Text</a> 
      <a href="../module3/history.html">Text</a> 
      <a href="../module3/location.html">Text</a> 
      <a href="../module3/navigator.html">Text</a> 
     </div> 
    </body> 
    </html> 

ответ

0

Это очень плохой способ скрыть меню через короткий промежуток времени.

Вам лучше изменить, что:

function hideMenu(objID) 
{ 
    timer[objID] = window.setTimeout(function() { 
     setVisibility(objID, false); 
    }, 150); 
} 

Метод setTimeout может также принимать сырую строку, которая затем оценивает и выполняющийся на лету. Оценка в JavaScript (используется также методом eval()) не является хорошей практикой и лучше избегать, когда это возможно. В этом случае его можно легко избежать, передав функцию setTimeout.

Сосредоточение еще глубже на синтаксисе, давайте возьмем эту строку:

var m="setVisibility('"+objID+"',false)"; 

Это создает строку и добавив значение переменной с именем objID внутри него, окружив его в одинарные кавычки, так что он будет принят как строка. Если, например, значение этой переменной T250 результирующая строка будет:

setVisibility('T250',false) 
+0

Большое спасибо, но вы можете объяснить синтаксис этого «+ objID +». Я имею в виду два слоя кавычек. –

+0

@ KarenKhasikyan см. Мое редактирование. –

+0

@KarenKhasikyan извините, не понимаю, что вам еще не понятно. Вы можете объяснить? –

0

Я объясню вам эту функцию:

function hideMenu(objID) 
{ 
    var m="setVisibility('"+objID+"',false)"; 
    timer[objID]=setTimeout(m,150); 
} 

Первая переменная m устанавливается в строку. Эта строка завернута в ". Но вам нужно добавить переменную objID в строку. Таким образом, строка закрывается с помощью ". A plus (+) используется для подключения переменной objID. (Параметр hideMenu). Затем эта строка снова соединяется с другой строкой.

Это означает, что если вы звоните

hideMenu(10) 

Переменная m является для: setVisibility(' и содержание objID, в данном случае 10 и ',false)

setVisibility('10',false)

0
“ setVisibility (' ” + objID +“ ' , false) ” 

является конкатенация трех элементов.

“ setVisibility (' ” 
objID 
“ ' , false) ” 

Первый и последний являются строками, а objID преобразуется в строку в этом контексте.

Так что, если ObjId это «14» Вы получаете значение (строка)

“ setVisibility (' 14 ' , false) ” 

назначен к переменной м

0

, кажется, что objID является переменной, которая равна key из object и один из синтаксисов для ссылки на атрибут object в javascript равен

objectName[keyName] 

При использовании этого метода вы можете ввести string с кавычками (например, "myKey") или имя переменного, с другим методом

objectName.keyName 

вы можете ввести только строку без кавычек.

так timer[objID]= будет означать, что существует object называется timer, к которому добавляемый атрибут, и его называют то, что текущее значение objID есть.

в данном конкретном случае (timer[objID]=setTimeout(m,150);) св таймерная функции для запуска, который может быть отменен позже с window.clearTimeout(timer[objID]); - обеспечение objID все еще имеет то же значение.