2013-10-15 2 views
0

Я пишу программу, которая запрашивает сумму покупки, а затем вычисляет скидку. Функция работает, но свойство innerHTML работает, только если я установил его в параграфе p>. Я хочу, чтобы он печатался на вкладке>. Поэтому мой вопрос заключается в том, какую собственность мне нужно использовать.свойство получить значение в поле ввода

сообщения

Ошибки: неперехваченного TypeError: Невозможно установить свойство 'innerHTML' нулевого

<body> 
<p>Enter amount of purchases:<input type =" text" id ="purchase_amount" onkeyup ="calculate_discount()"/></p> 
<p>Discount price:<input type="text" id =" discount_amount"/></p> 
</body> 

function calculate_discount() { 
var purchase_amount = document.getElementById("purchase_amount").value; 
var answer; 
if (purchase_amount >= 10) 
{ 
    answer = purchase_amount - (purchase_amount * .10); 
} 
else if (purchase_amount < 10) 
{ 
    answer = purchase_amount; 
} 
document.getElementById("discount_amount").innerHTML = answer; 

}

Спасибо

http://jsfiddle.net/xK4s4/

+0

Вы получаетепотому что идентификатор элемента содержит пробел. Удалите его и используйте '.value' вместо' .innerHTML'. –

ответ

0

  1. Удалить пробелы в атрибуте идентификатор элемента ввода скидка сумма

    id=" discount_amount"

  2. Set value instead of innerHTML.
  3. Make sure your script is placed before input element.
Work script:

<script> 
    function calculate_discount() { 
     var purchase_amount = document.getElementById("purchase_amount").value; 
     var answer; 
     if (purchase_amount >= 10) 
     { 
      answer = purchase_amount - (purchase_amount * .10); 
     } 
     else if (purchase_amount < 10) 
     { 
      answer = purchase_amount; 
     } 
     document.getElementById("discount_amount").value = answer; 
    } 
</script> 

<body> 
    Enter amount of purchases: 
    <input type="text" id="purchase_amount" onkeyup="calculate_discount()"/> 

    Discount price: 
    <input type="text" id="discount_amount"/> 
</body> 

Demo in jsfiddle.net

0

Demo

Элементы ввода не используют свойство innerHTML, вместо этого устанавливают свойство value.

document.getElementById("discount_amount").value = answer; 

Другие вопросы:

В скрипке, вы запустите код onload, это означает, что функция из глобальной области видимости и не может быть вызвана KeyUp событием. Перейдите на страницу no wrap - in head.

У вас есть пробел перед Скидка DISCOUNT_AMOUNT элемент ID:

<p>Discount price:<input type="text" id =" discount_amount"/></p> 
+0

'значение' должно использоваться, но элементы' input' по-прежнему имеют свойство 'innerHTML' (afaik), и это не объясняет ошибку. –

+0

@FelixKling да, это плюс плюс плюс загрузка. Ну, нагрузка - это только проблема в скрипке, его код отличается от этого, потому что он доходит до ошибки, а скрипка - нет. – MrCode

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