Сохраните данные формы в localalstorage, отобразите их в innerHTML и удалите их кнопкой удаления данных

У меня есть этот код для сохранения данных формы в localalstorage, а затем отображать его, заменяя <span id="recalledtext" >Dear Visitors</span> с. innerHTML.

   <HTML>
    <head>
    <script>
    function myfunction1(){texttosave = document.getElementById('textline').value ; localStorage.setItem('mynumber', texttosave); } function myfunction2(){document.getElementById('recalledtext').innerHTML = localStorage.getItem('mynumber'); }
    </script>
    </head>
    <body onload='myfunction2()'>
    <input type="text" id="textline" placeholder="Enter Your Name"/> <button id="rememberer" onclick='myfunction1()'>Save</button>
    <br>
     Welcome<span id="recalledtext" >Dear Visitors</span> Refresh the page to see changes
    </body>
    </HTML>

Он работал отлично, но я также хотел кнопку удаления данных. Итак, я изменил код в это:

<HTML>
<head>
<script>
function myfunction1(){texttosave = document.getElementById('textline').value ; localStorage.setItem('mynumber', texttosave); } function myfunction2(){document.getElementById('recalledtext').innerHTML = localStorage.getItem('mynumber'); } function myfunction3() localStorage.removeItem('mynumber'); return '';}
</script>
</head>
<body onload='myfunction2()'>
<input type="text" id="textline" placeholder="Enter Your Name"/> <button id="rememberer" onclick='myfunction1()'>Save</button> <button id="recaller" onclick='myfunction3()'>Delete Your Name</button>
<br>
 Welcome<span id="recalledtext" >Dear Visitors</span> Refresh the page to see changes
</body>
</HTML>.

Но после добавления функции myfunction3() код полностью перестал работать.

Источник

1 ответ

Я нашел ответ сам. Я был для вас долгое время, затем я начал проверять код JavaScript. Там был пропущенный символ "{" Вот правильный код

    <HTML><head>
<script>
function myfunction1(){texttosave = document.getElementById('textline').value ; localStorage.setItem('mynumber', texttosave); } function myfunction2(){document.getElementById('recalledtext').innerHTML = localStorage.getItem('mynumber'); } function myfunction3() localStorage.removeItem('mynumber'); return '';}
</script>
</head>
<body onload='myfunction2()'>
<input type="text" id="textline" placeholder="Enter Your Name"/> <button id="rememberer" onclick='myfunction1()'>remember text</button> <button id="recaller" onclick='myfunction3()'>Delete Your Name</button>
<br>
 Welcome<span id="recalledtext" >Dear Visitors</span> Refresh the page to see changes
</body>
</HTML>
Источник
Другие вопросы по тегам