如何在卡片编辑界面提取[sound:xxxxxx.mp3]这个元素

496147678

. q2 K3 z2 |7 N5 T7 A
" T' b$ h  e# U% ?想用
<audio loop autoplay controls src="xxxxx.mp3">的方式完成音频无限制自动循环播放

% ^9 Z  j5 }7 k+ e' F. p于是想提取 xxxxx 的内容

$ M, r1 b3 T5 Q* i0 K5 vvar price = document.getElementById("audio").innerTEXT;
alert (price)
7 _8 z2 v5 }- O( v* L# j% k) o
6 B+ d2 W; f$ q! z1 [9 z7 S0 q7 C但是并不可行，想破脑袋，不知道有什么解决方法

已经定义了 音频的 id=audio
: u0 q+ U+ k3 j; V  g1 Bprice反馈的结果是空白
3 h$ Q  s0 e1 b1 e* C9 A
用这个方法去弄expression，也就是{{正面}}，是可行的

496147678

arruno 发表于 2022-4-1 10:46
我今天抽空试试。其实有一个不那么美观、但是简单有效的方法，就是你在卡片里，把{{音频}}这个字段复制n次 ...

6 p1 y0 S, R5 A
! ^0 d! V% G2 m( V5 R  V十分感谢！！我就准备这么做了。另外我也看到了一个帖子，也挺有意思的，与帖子无关，也可以看看学习一下。
% m- f3 @5 N: K* {6 c) Y% A
再次感谢！
& d* Y( a4 u9 \
———————————————

5 c7 V" b% _0 H 基本流程：

• 卡负责其模板渲染： render_output
  5 a! V% t- A; [+ R
  
  . M! c7 ]' u) t' ?7 ^% i( }% |
  • render_into
    8 X9 z. E- n( L! Y2 U) E9 g
    2 ?& X& `* `+ j& K. ]# _$ Q) |6 }- s
• 从模板解析{{tts en_US voices=Bob,Jane:Field}}并转换为[anki:tts][en_US voices=Bob,Jane]text[/anki:tts] ： tts_filter
• 从[anki:tts]转换为[anki:play:q:0] ： extract_av_tags
  
  
  6 F& A3 k3 n7 I' k
  • [sound:]标签也已完成此操作
    
  • 这会将其转换为AVTag的列表，并且文本表示形式引用此列表的索引。
    ; g) T* V3 Z1 E/ k0 j5 R* `5 L$ P
    
• AVTag的列表存储在卡中： render_card_from_context ， render_card ， question_av_tags
  4 e5 w/ {( R6 @2 s
  
  4 }  K4 z' ^2 u' ^* t- W
  • 列出了两个列表，一个用于问题，一个用于答案。
    . O  H- T- V- I) I: z
    , n9 e( O$ l' l' w# c
• 在卡片上渲染： prepare_card_text_for_display
  
  
  % v8 H7 Q2 Q4 a, E; B; X
  • [anki:play]转换为svg，其调用pycmd('play:q:0') av_refs_to_play_icons
    3 _# r  ?7 B5 J% s  J
    
• 审阅者将卡中的AVTag传递给sounds.av_player ： replay_audio
• aqt.sounds.av_player是玩家列表的抽象。 这些设置为接受AVTag ，并将其排名为setup_audio _best_player_for_tag
• 排名逻辑： voice_for_tag
  * .play在播放器上被调用，
• 添加{{tts-voices}}字段： on_tts_voices
  

496147678

arruno 发表于 2022-3-30 22:45
/ n2 S4 [2 v# V& |2 F0 N: K那个，js对大小写敏感，你改成innerText试试。innerHTML/innerText
! {: X' ]3 E! P4 W8 B5 s- W另外，直接写上不可以么，如果这个占位 ...

& j0 g( J( Z& \+ n. J3 r% y占位符都是[sound:appppppple.mp3]的格式，我在浏览器上测试过了没有问题，anki里跑不成，其他方式也试过了，都不行

卡片HTML部分：
% H# p3 A( |- f' b: l) f) i$ q. @2 i<span id="audio1" class="voice">{{音频}}</span>
<audio id="audio2" loop autoplay></audio>
% ]; {6 U( v& O/ o& i2 Z* f
JS部分：
% `$ t, l/ }* J; f+ h% z    var str = document.getElementById("audio1").innerHTML;
" F  t8 s' a7 V& Q+ S& K    var txt = str.replace("[sound:","").replace("]","");
( R' ^: s6 D* h( [5 k        txt = "<source src=" + txt + ">"
8 `6 s( I, N6 _# d* l5 Z/ K    document.getElementById("audio2").innerHTML = txt;

496147678

arruno 发表于 2022-3-30 22:45
那个，js对大小写敏感，你改成innerText试试。innerHTML/innerText
另外，直接写上不可以么，如果这个占位 ...

3 J* r% I# i: i1 p2 j& O尝试过了，不行，哎。似乎各种方法都识别不了{{音频}}，似乎卡片在生成之前就已经被提取转换了。

头秃啊

496147678

8 \  j. O8 S0 }& y! h

arruno 发表于 2022-3-29 12:02
没有定义id啊，document.getElementsByTagName("audio")[0].src 这样就可以

您可能没有理解我意思。
举个例子，我现在有一张卡片，卡片正面是apple，这张卡片是有音频的，但音频的文件名是随机的，我不清楚。我现在想让这张卡片音频循环播放，于是想到用<audio loop autoplay controls src="xxxxx.mp3">的方法，其中xxxx我不知道。于是我想提取每张卡片的音频文件的名字。
7 j+ e) B4 l  V, v6 x( m卡片正面是这样的：
/ ~, x) B* J% F' ]<div class="section">
<div class="expression">{{单词}}</div>
) E. c# P) D7 @9 y0 q<span id=“audio” class="voice">{{音频}}</span
$ }* |3 w2 A4 d4 S</div>
- _) R) y- c9 @/ L& }
也就是我想知道  {{音频}}  的名字是什么，以便下一部操作

/ k' n5 O3 v& x6 ?( A- J于是我尝试：
var price = document.getElementById("audio").innerTEXT;
alert (price)
5 e# u. Z5 B! g' Iprice返回是undefined
+ p+ e! Z- y' Z& l; `+ \
8 u8 b3 C4 e: H* S4 K' t* O2 O您的方法我也试了，也是一样
% N) \+ m. b! J  M5 h3 Y9 a
很抱歉麻烦您了，您看看有什么好的建议吗

arruno

<audio loop autoplay controls src="xxxxx.mp3"> 没有定义id啊，document.getElementsByTagName("audio")[0].src 这样就可以

arruno

那个，js对大小写敏感，你改成innerText试试。innerHTML/innerText
- L3 F  Z# M' [7 o. a8 _/ C' V另外，直接写上<audio loop autoplay controls src="{{音频}}">不可以么，如果这个占位符就是文件名本身的话，不需要再用js绕一下。

arruno

1 t- E% |) I! {' X1 |0 Q! Y# D我今天抽空试试。其实有一个不那么美观、但是简单有效的方法，就是你在卡片里，把{{音频}}这个字段复制n次，它就会自动播放n次。
' H8 u# ?6 J% E6 }5 A; x比如：{{音频}}{{音频}}{{音频}} 这样就会重复3次。
如果不能解决，至少这样可以部分实现你的需求。
, J) ~% D1 y; I1 ^& ]0 O
! g/ M' K/ Y  M# z' _$ w———————————————
看了一下，是我的疏忽，音频比较特殊，会被Anki模板引擎渲染成这样的HTML结构：
<a class="replay-button soundLink" href="#" onclick="pycmd('play:a:0'); return false;">
<svg class="playImage" viewBox="0 0 64 64" version="1.1">
<circle cx="32" cy="32" r="29"></circle>
2 p' ^' a' n9 i+ E2 L, e<path d="M56.502,32.301l-37.502,20.101l0.329,-40.804l37.173,20.703Z"></path>
</svg>
1 h! t: V7 E: X1 o. [$ d</a>
: X9 |) E6 Q# a9 I/ k- U建议还是用上面的方法吧，可以加一个hidden属性做好看一点：

+ a. S! c) h$ F3 t7 w* _, U/ V<div hidden="true">
) ~; X6 q! _4 Z  Y2 U{{音频}}
{{音频}}
{{音频}}
</div>