1

首先，请参阅下面的一些相关但不完全正确的代码：

<div id='0' style='display:none'><p>{{Field 1}}</p></div>
<div id='1' style='display:none'><p>{{Field 2}}</p></div>
<div id='2' style='display:none'><p>{{Field 3}}</p></div>

<script>
    document.getElementById(Math.floor(Math.random() * 3)).style.display = 'inline';
</script>

我有一个旧的 Anki 套牌，我总是填写 3 个字段，因此这段代码可以正常工作以随机输出其中一个。我现在遇到的问题是我正在处理一个甲板，每个笔记将填写不同数量的字段。

基本上，我试图弄清楚如何编写类似的 JavaScript 代码，除非它会从不同数量的事物中挑选出随机事物。如果在 Anki 中将名为“Field 1”的字段留空，我认为 {{Field 1}} 不会返回任何内容。也许代码可以跳过任何不返回任何内容并显示返回字符串的随机字段（而不是选择一个随机字段，如果选择其中一个空字段则不输出任何内容）？

提前致谢！

4

1 回答 1

3 
<!--- {{#field}}{{/field}} makes sure anki template engine doesn't render empty field into HTML --->
{{#Field 1}}<div class="field" style="display:none"><p>{{Field 1}}</p></div>{{/Field 1}}
{{#Field 2}}<div class="field" style="display:none"><p>{{Field 2}}</p></div>{{/Field 2}}
{{#Field 3}}<div class="field" style="display:none"><p>{{Field 3}}</p></div>{{/Field 3}}

<script>
  var fields = document.querySelectorAll('.field');
  var random = Math.floor(Math.random() * data.length);

  if(fields.length > 0) {
    fields[random].style.display = 'inline';
  }
</script>
于 2018-02-11T06:27:19.320 回答