2013-11-17 8 views
0

Я делаю простую игру для продажи анчоусов. У меня есть апгрейд, чтобы купить небольшую рыболовную сеть. Рыболовная сеть стоит определенное количество анчоусов, поэтому я вычитаю это число из общей суммы, а затем переписываю с помощью innerHTML. Я хочу, чтобы эта небольшая сеть добавляла 1 анчоус каждую секунду, поэтому я использую window.setInterval. Однако теперь каждую секунду [object HTMLSpanElement] записывается на страницу.Javascript возвращает [object HTMLSpanElement]

Что мне делать?

Вот jsfiddle ссылка: http://jsfiddle.net/Bj6M5/1/

А вот код:

<head> 
<script type="text/javascript"> 
var anchovies = 0; 
var money = 0; 

function goFish(num) { 
    anchovies = anchovies + num; 
    money = 0.433 * anchovies; 
    var money_rounded; 
    money_rounded = money.toFixed(2); 
    if (anchovies != 1) { 
     document.getElementById("anchovies").innerHTML = anchovies + " anchovies"; 
    } 

    else { 
     document.getElementById("anchovies").innerHTML = "1 anchovy"; 
    } 
    document.title = "$" + money_rounded + " - Anchovy Bros."; 
} 

function buySmallNet(){ 
var smallnet_price = Math.floor(10 * Math.pow(1.1,smallnets));  
    if (anchovies >= smallnet_price) {         
     smallnets = smallnets + 1;         
     anchovies = anchovies - smallnet_price; 
     if (smallnets != 1) {      
      document.getElementById("smallnets").innerHTML = smallnets + " small nets"; 
     } 
     else { 
      document.getElementById("smallnets").innerHTML = "1 small net"; 
     } 
     document.getElementById("anchovies").innerHTML = anchovies + " anchovies"; 
    } 

    else { 
     alert("You don't have enough anchovies!"); 
    } 
} 

window.setInterval(function(){ 
    goFish(smallnets); 
}, 1000); 
</script> 
    <title>$0 - Anchovy Bros.</title> 
</head> 
<body> 

<button onclick="goFish(1);">FISH!</button> 
<br> 
<span id="anchovies"></span> 

<div style="float:right;" id="upgrades"> 
    <center> 
    <button onclick="buySmallNet();">small fishing net</button> 
    <br> 
    <span>costs 15 anchovies</span> 
    <br> 
    <span id="smallnets"></span> 
    </center> 
</div> 
</body> 

+0

проблема в том, что _smallnets_ не был инициализирован. сделайте это: 'var smallnets = 1;' – amdixon

ответ

0

Вы звоните goFish(smallnets). smallnets - это идентификатор элемента, поэтому вы передаете этот элемент. Вы ожидаете номер в goFish и выполняете все виды вычислений и присвоений, которые, очевидно, терпят неудачу, потому что это элемент, а не число. В конце вы выводите anchovies, которому теперь присвоен этот элемент, а не результат вычисления.

Таким образом, есть недостающие ссылки где-то, где вам нужно преобразовать элемент в число, которое, вероятно, должно быть содержимым элемента (являющегося числом небольших сетей в задании).

0

Причина эта линия:

goFish(smallnets); 

Вы не объявило smallnets переменных в любом месте, но у вас есть элемент в разметке с id"smallnets" который является span. Большинство браузеров создают глобальные переменные для элементов с значениями id, где имя переменной - id, а значение - элемент DOM.

Тогда в goFish, эта линия:

anchovies = anchovies + num; 

есть (на первом проходе):

anchovies = 0 + a_span_element; 

Поскольку span не может быть разумно преобразуется в число, оно преобразуется в строка, которая равна "[object HTMLSpanElement]". Затем 0 преобразуется в строку, и у вас есть "0[object HTMLSpanElement]".

И в следующий раз, когда срабатывает интервал, вы добавляете к нему еще одну копию "[object HTMLSpanElement]" и т. Д. И т. Д.

Если ваша цель состоит в том, чтобы использовать текст из span, вы хотите:

goFish(smallnets.innerHTML); 

или лучше

goFish(parseInt(smallnets.innerHTML, 10)); 

или даже лучше, не полагаться на глобальный созданный с помощью id:

goFish(parseInt(document.getElementById("smallnets").innerHTML, 10)); 

Вы Будете также хотеть поставить 0 или что-то в промежутке, например .:

<span id="smallnets">0</span> 
+0

СПАСИБО! Это было намного проще, чем я ожидал, жаль, что я никогда не сталкивался с этой проблемой раньше –

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