Чтобы в карточке выводилось поле с вводом ответа, нужно перед название поля написать ‘type:’
Например:’type:example‘
и тогда когда мы выведем это же название поля, то выведеться не значение этого поля, а разница между введеным значением и результатом.
⚹ hint:example⚹ hint:example
Чтобы вместо значения поля выводилось «показать [название поля]», а только после нажатия выводилось значение поля, тогда для этого нужно перед названием поля ввести «hint:»
Например:’hint:example‘
⚹ 3.2.
Чтобы выводить заголовок группу и только после нажатия на него вывести его потомков нужно сделать следующим образом.
<details> <summary>Группа-1</summary> Ветка-1 Ветка-2 ... Ветка-n </details>
Результат
Группа-1
Ветка-1Ветка-2
…
Ветка-n
Результат фото

<script>
var content = document.getElementById("sentence").innerHTML;
var unpunctuated = replacePunctuation(content);
var words = (unpunctuated).split(" ");
var punctuatedWords = (content).split(" ");
var processed = "";
for (i=0; i<words.length;i++) {
processed+="<a href=\"https://dictinary.cambridge.org/dictionary/english-russian/" + words[i]+"\">";
processed+= punctuatedWords[i];
processed+="</a>"
for (i=0; i<words.length;i++) {
processed+=punctuatedWords[i];
processed+="</a>"
}
document.getElementById("sentence").innerHTML = processed;
function replacePunctuation(s) {
var punctuationless = s.replace(/[.,V#!S%\^&\*;:{}=\-_`~()]/g,"");
var finalString = punctuationless.replace(/\s(2,)/g,"");
return s;
}
</script>
<div id="sentence">{{пример}}</div>
Объяснение работы программы (кода)
Данный код является скриптом на языке JavaScript, который выполняет следующие действия:
- Получает содержимое элемента с id «sentence» (этот элемент должен быть на странице HTML, на которой используется данный скрипт).
- Удаляет знаки препинания из текста, используя функцию replacePunctuation.
- Разбивает текст на слова, используя пробел как разделитель.
- Разбивает исходный текст на слова, используя пробел как разделитель.
- Для каждого слова в тексте создает HTML-ссылку на перевод данного слова на сайте Cambridge Dictionary.
- Заменяет исходный текст на новый HTML-код, в котором каждое слово является ссылкой на перевод в словаре.
- Функция replacePunctuation удаляет из переданной строки все знаки препинания и двойные пробелы, возвращая обработанную строку.
В коде используется тег div содержимое которого «If you’ve ( picked up this book,» и заменяется в результате выполнения скрипта.
<div id="sentence">If you’ve ( picked up this book,</div>
Вот пример моей колоды, с двумя картам и соответственно Лицо и Оборот
CARD 1 / Лицо
<div class="css_comment">
тип-1 карта-{{number}}
</div>
<div class="css_phrase">
{{English_phrase}}
</div>
<br>
<div class="css_word">
{{English_word}}
</div>
{{English_Sound}}<br>
<div class="css_phrase">
{{Deutsch_phrase}}
</div>
<br>
<div class="css_word">
{{Deutsch_word}}
</div>
{{Deutsch_Sound}}
<div class="css_comment">
<details>
<br>
<summary>russia</summary>
<br>
<div class="css_phrase_2">
{{Russia_phrase}}
</div>
<br>
<div class="css_word">
{{Russia_word}}
</div>
{{Russia_Sound}}
</details>
</div>
{{image}}
CARD 1 / Оборот
<div class="css_phrase_2">
{{Russia_phrase}}
</div>
<br>
<div class="css_word">
{{Russia_word}}
</div>
{{Russia_Sound}}
<div class="css_comment">
<details>
<br>
<summary>deutsch</summary>
<br>
<div class="css_phrase">
{{Deutsch_phrase}}
</div>
<br>
<div class="css_word">
{{Deutsch_word}}
</div>
{{Deutsch_Sound}}
</details>
</div>
CARD 2 / Лицо
<div class="css_comment">
тип-2 карта-{{number}}
</div>
<div class="css_phrase_2">
{{Russia_phrase}}
</div>
<br>
<div class="css_word">
{{Russia_word}}
</div>
{{Russia_Sound}}
<div class="css_comment">
<details>
<br>
<summary>deutsch</summary>
<br>
<div class="css_phrase">
{{Deutsch_phrase}}
</div>
<br>
<div class="css_word">
{{Deutsch_word}}
</div>
{{Deutsch_Sound}}
</details>
</div>
{{image}}
CARD 2 / Оборот
<div class="css_phrase">
{{English_phrase}}
</div>
<br>
<div class="css_word">
{{English_word}}
</div>
{{English_Sound}}<br>
<div class="css_phrase">
{{Deutsch_phrase}}
</div>
<br>
<div class="css_word">
{{Deutsch_word}}
</div>
{{Deutsch_Sound}}
<div class="css_comment">
<details>
<br>
<summary>russia</summary>
<br>
<div class="css_phrase_2">
{{Russia_phrase}}
</div>
<br>
<div class="css_word">
{{Russia_word}}
</div>
{{Russia_Sound}}
</details>
</div>