как исправить "неперехваченную ссылку"?

Question

Я определил функцию CalcuChange () в голове, но я получаю сообщение о том, что при нажатии кнопки ввода она не определена, что мне делать?

<script type="text/javascript">
            initalP=parseFloat(document.getElementById('pennies').value);
                quarters=Math.floor(initalP/25);
                dimes=Math.floor((initalP%25)/10);
                nickels=Math.floor(((initalP/25)%10)/5);
                pennies=(initalP - quarters - dimes - nickels);
                total=(quarters + dimes + nickels + pennies); 
            function calculateChange()
            {


                document.getElementById('outPut').innerHTML=
                <ul>
                    <li>'The total number of coins is ' + total + '.'</li>
                    <li> + quarters + ' Qaurters' +</li>
                    <li> + dimes + ' Dimes' +</li>
                    <li> + nickels + ' Nickels' +</li>
                    <li> + pennies + ' Pennies' +</li>


                </ul>;

            }
        </script>

<input type="button" value="click me for change" onclick="calculateChange();">

<div id="outPut"></div>

Я ожидаю, что показанные ответы по математическим уравнениям будут показаны в выходном div, но когда я нажимаю на кнопку, ничего не происходит.

Answer 1

Вы можете передавать только строковые значения в атрибут innerHTML.Исправив это, ваша функция должна запуститься.

 document.getElementById('outPut').innerHTML= "<ul><li>'The total number of coins is ' + total + '.'</li><li> + quarters + ' Qaurters' +</li><li> + dimes + ' Dimes' +</li><li> + nickels + ' Nickels' +</li><li> + pennies + ' Pennies' +</li></ul>";