2015-01-13 2 views
0

Мне нужны некоторые указания по основной проблеме Javascript.Функция javascript не может распознать переменную в том же документе

Я создаю страницу ejs для отображения информации о пользователе.

  1. Когда я загружаю эту страницу, я получаю данные «userList» как массив. затем я помещал их в массив vUserList для будущего использования. и когда вызывается функция 'showUserInfo', я помещаю эту информацию в документы.

У меня есть две проблемы.

Когда я использовал для цикла и функции в одном и том же теге, функция вообще не работала. Когда я разделяю цикл и функцию на другой тег, обе работают, но функция не может распознать массив vUserList .

Как я могу позволить функции распознать переменную Array?

Вот мой код для страницы.

спасибо.

<!DOCTYPE html> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> 
    <title></title> 
    <script> 
     var vUserList = new Array(); 
     <% for (var i = 0; i < userList.length ; i++) { %> 
      vUserList[<%=i %>] = new Array(); 
      vUserList[<%=i %>].googleUid = <%=userList[i].googleUid %>; 
      vUserList[<%=i %>].googleName = <%=userList[i].googleName %>; 
      vUserList[<%=i %>].memberUid = "<%=userList[i].memberUid %>"; 
      vUserList[<%=i %>].clientVersion = <%=userList[i].clientVersion %>; 
      vUserList[<%=i %>].deviceId = <%=userList[i].deviceId %>; 
      vUserList[<%=i %>].ticket = <%=userList[i].ticket %>; 
      vUserList[<%=i %>].joinTime = <%=userList[i].joinTime %>; 
      vUserList[<%=i %>].loginTime = <%=userList[i].loginTime %>; 
      vUserList[<%=i %>].feni = <%=userList[i].feni %>; 
      vUserList[<%=i %>].fuel = <%=userList[i].fuel %>; 
      vUserList[<%=i %>].itemAttackCount = <%=userList[i].itemAttackCount %>; 
      vUserList[<%=i %>].lastStation = <%=userList[i].lastStation %>; 
      vUserList[<%=i %>].clearCount = <%=userList[i].clearCount %>; 
      vUserList[<%=i %>].playLevel = <%=userList[i].playLevel %>; 
      vUserList[<%=i %>].tutorial = <%=userList[i].tutorial %>; 
      vUserList[<%=i %>].fuelChargeTime = <%=userList[i].fuelChargeTime %>; 
      vUserList[<%=i %>].fuelTime = <%=userList[i].fuelTime %>; 
      vUserList[<%=i %>].level = new Array(); 
      vUserList[<%=i %>].level = <%=userList[i].level %>; 
     <% } %> 
    </script> 

    <script> 
     function showUserInfo(idx) { 
      alert(vUserList[0].memberUid); 
      document.getElementById("googleUid").innerHTML=vUserList[idx].googleUid; 
      document.getElementById("googleName").innerHTML=vUserList[idx].googleName; 
      document.getElementById("memberUid").innerHTML=vUserList[idx].memberUid; 
      document.getElementById("clientVersion").innerHTML=vUserList[idx].clientVersion; 
      document.getElementById("deviceId").innerHTML=vUserList[idx].deviceId; 
      document.getElementById("ticket").innerHTML=vUserList[idx].ticket; 
      document.getElementById("joinTime").innerHTML=vUserList[idx].joinTime; 
      document.getElementById("loginTime").innerHTML=vUserList[idx].loginTime; 
      document.getElementById("feni").innerHTML=vUserList[idx].feni; 
      document.getElementById("fuel").innerHTML=vUserList[idx].fuel; 
      document.getElementById("itemAttackCount").innerHTML=vUserList[idx].itemAttackCount; 
      document.getElementById("lastStation").innerHTML=vUserList[idx].lastStation; 
      document.getElementById("clearCount").innerHTML=vUserList[idx].clearCount; 
      document.getElementById("playLevel").innerHTML=vUserList[idx].playLevel; 
      document.getElementById("tutorial").innerHTML=vUserList[idx].tutorial; 
      document.getElementById("fuelChargeTime").innerHTML=vUserList[idx].fuelChargeTime; 
      document.getElementById("fuelTime").innerHTML=vUserList[idx].fuelTime; 
     } 
    </script> 



</head> 
<body> 
    <div id="header"> 
     <% include menubar.ejs %> 
    </div> 
    <div id="userList" vertical-align=bottom align=left> 
     Here will be UserList from DB<br> 
     <form method="post" action="/getUserList"> 
      memberUid<input type="text" name="memberUid"><br> 
      LastStation<input type="text" name="startStation">~<input type="text" name="endStation"><br> 
      Number of List <select name="limitNum"> 
         <option value="10">10</option> 
         <option value="30">30</option> 
         <option value="50">50</option> 
        </select><br> 
      <input type="submit" value="Search"> 
     </form> 
     <% if (userList != null) { 
      for (var i = 0; i < userList.length; i++) { %> 
       <a href="#" onclick="showUserInfo(<%= i %>); return false;"><%= userList[i].memberUid %></a> <br> 
       <% console.log(userList[i].memberUid) %> 
     <% } } %> 

    </div> 
    <div align=center vertical-align=bottom> 
     user Information. <br> 
     googleUid : <p id="googleUid"></p> 
     googleName : <p id="googleName"></p> 
     memberUid : <p id="memberUid"></p> 
     clientVersion : <p id="clientVersion"></p> 
     deviceId : <p id="deviceId"></p> 
     ticket : <p id="ticket"></p> 
     joinTime : <p id="joinTime"></p> 
     loginTime : <p id="loginTime"></p> 
     feni : <p id="feni"></p> 
     fuel : <p id="fuel"></p> 
     itemAttackCount : <p id="itemAttackCount"></p> 
     lastStation : <p id="lastStation"></p> 
     clearCount : <p id="clearCount"></p> 
     playLevel : <p id="playLevel"></p> 
     tutorial : <p id="tutorial"></p> 
     fuelChargeTime : <p id="fuelChargeTime"></p> 
     fuelTime : <p id="fuelTime"></p> 
    </div> 

</body> 
</html> 
+0

Как выглядит сгенерированная разметка (пожалуйста, держите ее минимальной)? – RobG

ответ

0

Переменная vUserList не входит в сферу действия функции showUserInfo. Вам нужно будет объявить (шаг var) переменную в области функции, поскольку javascript использует область действия уровня. Вы должны поместить весь код в один тег скрипта. Выясните, почему это не работает. Я думаю, что это просто проблема форматирования. И поместите переменную внутри функции showUserInfo.

Грязный взлом может работать для вас. Удалите слово «var» из объявления vUserList. Затем он загрязнит глобальное пространство имен. Но вы должны иметь доступ к нему из любого места в окне. Тем не менее я бы не предложил вам идти по этой дороге.

+0

"* Вам ** нужно **, чтобы поместить весь код в один тег скрипта *". Хорошее предложение, но «нужно», а не «нужно». – RobG

+0

@ RobG Geez. Нужно отметить и отредактировать. – Aditya

0

Просто комментарий (требуется пространство), некоторые предложения

В первом цикле вы делаете:

var vUserList = new Array(); 
<% for (var i = 0; i < userList.length ; i++) { %> 
    vUserList[<%=i %>] = new Array(); 
    vUserList[<%=i %>].googleUid = <%=userList[i].googleUid %>; 
    vUserList[<%=i %>].googleName = <%=userList[i].googleName %>; 
    ... 

Это присваивает массив для VUserList [я], а затем рассматривает его как Объект. Это работает, потому что массивы являются объектами, но не с помощью какого-либо из массива благости, так что вы должны использовать объект, и это считается чище использовать буквальный, а не вызов конструктора, так:

vUserList[<%=i %>] = {}; 
    ... 

Для того, чтобы вещи немного более кратким, вы можете использовать литерал как:

vUserList[<%=i %>] = { googleUid: <%=userList[i].googleUid %>, 
          googleName: <%=userList[i].googleName %, 
          ... 
          fuelTime: <%=userList[i].fuelTime %>, 
          level: [<%=userList[i].level %>] 
          }; 

Кроме того, рекомендуется использовать цикл и массив данных для функции showUserInfo:

function showUserInfo(idx) { 
    var userData = ['googleUid','googleName','memberUid','clientVersion','deviceId', 
    'ticket','joinTime','loginTime','feni','fuel','itemAttackCount','lastStation', 
    'clearCount','playLevel','tutorial','fuelChargeTime','fuelTime']; 

    userData.forEach(function(v) { 
    document.getElementById(v).innerHTML = vUserList[idx][v]; 
    }); 
} 

Вы можете применить аналогичную стратегию к первому циклу.

HTH. ;-)

Смежные вопросы