app/static/js/word_operation.js

@@ -68,6 +68,7 @@ function read_word(theWord) {
     Reader.read(to_speak, inputSlider.value);
 }
 
+
 /* 
  * interface Word {
  *   word: string,
@@ -102,9 +103,12 @@ function wordTemplate(word) {
         <a class="btn btn-warning" onclick="unfamiliar('${word.word}')" role="button">不熟悉</a>
         <a class="btn btn-danger" onclick="delete_word('${word.word}')" role="button">删除</a>
         <a class="btn btn-info" onclick="read_word('${word.word}')" role="button">朗读</a>
+        <a class="btn btn-primary" onclick="addNote('{{ word }}'); saveNote('{{ word }}')" role="button">笔记</a> <!-- Modify to call addNote and then saveNote -->
+        <input type="text" id="note_{{ word }}" class="note-input" placeholder="输入笔记内容" style="display:none;" oninput="saveNote('{{ word }}')"> <!-- Added oninput event -->
     </p>`;
 }
 
+
 /**
  * 删除某一词频元素
  * 此处word为词频元素对应的单词

app/templates/userpage_get.html

@@ -160,6 +160,8 @@
                     <a class="btn btn-warning" onclick="unfamiliar('{{ word }}')" role="button">不熟悉</a>
                     <a class="btn btn-danger" onclick="delete_word('{{ word }}')" role="button">删除</a>
                     <a class="btn btn-info" onclick="read_word('{{ word }}')" role="button">朗读</a>
+                    <a class="btn btn-primary" onclick="addNote('{{ word }}'); saveNote('{{ word }}')" role="button">笔记</a> <!-- Modify to call addNote and then saveNote -->
+                    <input type="text" id="note_{{ word }}" class="note-input" placeholder="输入笔记内容" style="display:none;" oninput="saveNote('{{ word }}')"> <!-- Added oninput event -->
                 </p>
             {% endfor %}
         </div>
@@ -173,6 +175,28 @@
         <script src="{{ js }}"></script>
     {% endfor %}
 {% endif %}
+
+
+<script type="text/javascript">
+    // Function to show/hide note input and load saved note content from localStorage
+    function addNote(word) {
+        var noteInput = document.getElementById("note_" + word);
+        var savedNote = localStorage.getItem(word); // Get the saved note from localStorage
+        if (savedNote) {
+            noteInput.value = savedNote; // Set the saved note if it exists
+        }
+        noteInput.style.display = (noteInput.style.display === 'none') ? 'inline-block' : 'none'; // Toggle display
+    }
+
+    // Example function to save the note to localStorage
+    function saveNote(word) {
+        var noteContent = document.getElementById("note_" + word).value;
+        localStorage.setItem(word, noteContent); // Save the note content in localStorage
+        console.log('Note saved for ' + word + ': ' + noteContent); // Log for debugging purposes
+    }
+</script>
+
+
 <script type="text/javascript">
     window.onload = function () { // 页面加载时执行
         const settings = {