# Autoplay all audio on front of card, but not back?

**URL:** <https://forums.ankiweb.net/t/autoplay-all-audio-on-front-of-card-but-not-back/60073>\
**Category:** Help\
**Created:** [April 30, 2025, 2:43pm UTC](https://forums.ankiweb.net/t/autoplay-all-audio-on-front-of-card-but-not-back/60073 "2025-04-30T14:43:56Z")\
**Posts on this page:** 8\
**Page:** 1

<div class="post-metadata">

**Author:** ![JRS](https://avatars.discourse-cdn.com/v4/letter/j/dbc845/32.png) [@JRS](https://forums.ankiweb.net/u/JRS)\
**Post date:** [April 30, 2025, 2:43pm UTC](https://forums.ankiweb.net/t/autoplay-all-audio-on-front-of-card-but-not-back/60073/1 "2025-04-30T14:43:56Z")

</div>

I have a card type with two audio fields on the front that I would like to autoplay when the card is shown.

I have the same two audio fields on the back of the card. I don’t want them to auto play, but I do want to be able to click them to play if needed.

Currently I have autoplay turned off, and I have pasted the below script (from another thread) into the front field of the card. This autoplays the first audio on front but doesn’t autoplay the second.

```auto
 <script>
	var elem = document.querySelector(".soundLink, .replaybutton");
	if (elem) { 
		elem.click();
	}else{
		window.onload = function(){
			var elem = document.querySelector(".soundLink, .replaybutton");
			if (elem) { elem.click();}
		}
	}
 </script>

```

Can this script be edited to autoplay all audio fields on the front of the card?

Or alternatively, could I just turn the deck autoplay setting on and add some kind of script so it is ignored on the back of the cards?

Thanks for the help.

---

<div class="post-metadata">

**Author:** ![Anon\_0000](https://avatars.discourse-cdn.com/v4/letter/a/c67d28/32.png) [@Anon\_0000](https://forums.ankiweb.net/u/Anon_0000)\
**Post date:** [April 30, 2025, 3:17pm UTC](https://forums.ankiweb.net/t/autoplay-all-audio-on-front-of-card-but-not-back/60073/2 "2025-04-30T15:17:22Z")

</div>

> [@JRS](#):
>
> Can this script be edited to autoplay all audio fields on the front of the card?

It probably just needs a `for` loop, which loops over all elements with the “.soundLink, .replaybutton” classes, then clicks using `.click()`.

> [@JRS](#):
>
> Or alternatively, could I just turn the deck autoplay setting on and add some kind of script so it is ignored on the back of the cards?

I don’t think that’s possible. The autoplay setting plays audio with python as far as I know, which isn’t controllable via js.

---

<div class="post-metadata">

**Author:** ![Danika\_Dakika](https://sea2.discourse-cdn.com/flex002/user_avatar/forums.ankiweb.net/danika_dakika/32/17815_2.png) [@Danika\_Dakika](https://forums.ankiweb.net/u/Danika_Dakika)\
**Post date:** [April 30, 2025, 4:55pm UTC](https://forums.ankiweb.net/t/autoplay-all-audio-on-front-of-card-but-not-back/60073/3 "2025-04-30T16:55:31Z")

</div>

> [@JRS](#):
>
> I have the same two audio fields on the back of the card. I don’t want them to auto play, but I do want to be able to click them to play if needed.

If you use the `{{FrontSide}}` special field on your back template, the same 2 audio fields will show and not autoplay. [Field Replacements - Anki Manual](https://docs.ankiweb.net/templates/fields.html#special-fields)

---

<div class="post-metadata">

**Author:** ![Eltaurus](https://sea2.discourse-cdn.com/flex002/user_avatar/forums.ankiweb.net/eltaurus/32/10287_2.png) [@Eltaurus](https://forums.ankiweb.net/u/Eltaurus)\
**Post date:** [May 2, 2025, 7:03am UTC](https://forums.ankiweb.net/t/autoplay-all-audio-on-front-of-card-but-not-back/60073/4 "2025-05-02T07:03:21Z")

</div>

> [@Anon\_0000](#):
>
> It probably just needs a `for` loop, which loops over all elements with the “.soundLink, .replaybutton” classes, then clicks using `.click()`.

A simple loop won’t do, unfortunately, as every next `click` will interrupt the audio playback initiated by the previous one. A fixed delay can be added, but it’s not ideal solution, if the audio lengths vary too much. ([it would be nice to have some kind of an API for that](https://forums.ankiweb.net/t/selective-autoplay-of-audio-for-certain-notes/47544/9))

Also, if using the `.click()` with AnkiDroid, this should be taken into account as well:

> <https://github.com/ankidroid/Anki-Android/issues/13455>
>
> \### Checked for duplicates?
> 
> \- \[X\] This issue is not a duplicate
> 
> \### What are t…he steps to reproduce this bug?
> 
> 1. Unzip the file and import the collection: \[money.zip\](https://github.com/ankidroid/Anki-Android/files/11010259/money.zip)
> 2. Preview the card with the Front side of "Money with Mathjax".
> 3. Reveal the backside.
> 
> \<details\> \<summary\>Card Details:\</summary\>
> 
> The card contains 4 fields: Front, Back, Audio, and AudioMoney.
> 
> Front:
> \`\`\`
> {{Front}}
> \`\`\`
> 
> Back:
> \`\`\`
> {{Front}}
> 
> \<hr id=answer\>
> 
> {{Back}}
> 
> 
> {{Audio}} 
> 
> \<span id="audiomoney"\>{{AudioMoney}}\</span\>
> 
> 
> 
> \<script\>
> ( () =\> {
> 
> let x = document.querySelector("#audiomoney .soundLink, #audiomoney .replaybutton");
> if (x) {
> console.log("going to click money...");
> x.click();
> console.log("clicked on money");
> }
> 
> })();
> \</script\>
> \`\`\`
> 
> \</details\>
> 
> \### Expected behaviour
> 
> The backside should show the loaded card.
> 
> \### Actual behaviour
> 
> The backside is not displayed.
> 
> \<details\>
> \<summary\>Screenshot:\</summary\>
> 
> !\[image\](https://user-images.githubusercontent.com/17107540/226154699-bea8b10b-7ba1-4af9-ae4a-c4911dfd533c.png)
> 
> \</details\>
> 
> \### Debug info
> 
> \`\`\`text
> AnkiDroid Version = 2.16alpha94-debug
> 
> Android Version = 13
> 
> Manufacturer = Google
> 
> Model = sdk\_gphone64\_x86\_64
> 
> Hardware = ranchu
> 
> Webview User Agent = Mozilla/5.0 (Linux; Android 13; sdk\_gphone64\_x86\_64 Build/TE1A.220922.021; wv) AppleWebKit/537.36 (KHTML, like Gecko) Version/4.0 Chrome/103.0.5060.71 Mobile Safari/537.36
> 
> ACRA UUID = 2daf5ce1-b594-44bb-b526-3ccb31f1a1e6
> 
> New schema = true
> 
> Scheduler = std2
> 
> Crash Reports Enabled = false
> 
> DatabaseV2 Enabled = true
> \`\`\`
> 
> 
> \### (Optional) Anything else you want to share?
> 
> This was tested multiple ways:
> \- My physical phone, with release 2.16alpha94 (from Github)
> \- Built with Android Studio and ran it on an emulator to \[this commit\](https://github.com/ankidroid/Anki-Android/commit/b07bf4dc5f90015ede4af51705d112bd67ec2f8c)
> \- The latest stable release version on Github (2.15.6), with the same emulator
> 
> \### Background on what this code is doing in the first place (to prevent the x-y problem):
> 
> The main problem I was trying to solve is \*\*to have a play button on the front side of the card, without having the audio played automatically\*\*. However, I want audio to be automatically played on the backside of the card. There does not seem to be a built-in approach to simply not have an audio file play on any Anki implementation without turning off audio replays on all card sides, so my current approach is to have two audio files: \`silence.wav\` and (some sentence audio).wav, and use javascript to immediately play the \`silence.wav\` file. This approach only plays silence.wav, and overrides the natural order of how the audio is played (as if the user played \`silence.wav\` manually), thus the sentence audio does not play. (A different approach that I believe would work is to have a very very long silence.wav file, i.e. 24 hours long. This would remove the need of using javascript to play the file in order to stop the other file from playing).
> 
> Unfortunately, something weird is happening with AnkiDroid. The audio plays as expected, i.e. the card with the front side "Money" has two audio files: the first one plays "Realm of the mad god", and the second one plays "Money x7". The second audio file is correctly played, and skips the first audio file. However, adding mathjax (i.e. the card with "Money with Mathjax") visually reveals the main problem: it seems like the card never "fully loads". The webview on \*\*both of these cards displays a persistent blue line at the top\*\*, suggesting that some javascript is still running and never finishes. This also suggests that \*\*Mathjax itself is not actually related to the problem\*\*, but simply a side effect that visually reveals the problem.
> 
> \<details\>
> \<summary\>Screenshot of blue line on card "Money"\</summary\>
> 
> !\[image\](https://user-images.githubusercontent.com/17107540/226155484-a18e5da8-ade4-462b-af22-53af84a8947e.png)
> 
> \</details\>
> 
> Using Chrome's webview on the "Money with Mathjax" card, the \`mathjax-needs-to-render\` CSS class is forever present on the backside of the card, and is not replaced with \`mathjax-rendered\`, which is the reason why the card doesn't show in the first place. I believe this suggests that something in the \`onPageFinished\` function of \`AnkiDroid/src/main/assets/scripts/card.js\` doesn't properly run in the first place.
> 
> 
> \---
> 
> \### Workaround
> 
> While writing this bug report, I basically rubber-ducked myself into a satisfactory workaround: we can use \`onShownHook\` and append a function to this array to play the audio. For example:
> \`\`\`js
> (() =\> {
> 
> async function playMoney() {
> 
> let x = document.querySelector("#audiomoney .soundLink, #audiomoney .replaybutton");
> if (x) {
> console.log("going to click money...");
> x.click();
> console.log("clicked on money");
> }
> 
> }
> if (onShownHook !== undefined) {
> onShownHook.push(playMoney);
> }
> 
> })();
> \`\`\`
> 
> Due to a) "Javascript functionality is provided without any support or warranty" according to the Anki manual, b) this is a very niche bug that most people probably won't deal with, and c) there exists a satisfactory workaround, I'll be closing this issue despite it not being technically fixed. Hopefully, if anyone comes across the same issue, this can serve as a good reference for them!
> 
> \### Research
> 
> \- \[X\] I am reporting a bug specific to AnkiDroid (Android app)
> \- \[X\] I have checked the \[manual\](https://ankidroid.org/docs/manual.html) and the \[FAQ\](https://github.com/ankidroid/Anki-Android/wiki/FAQ) and could not find a solution to my issue
> \- \[X\] (Optional) I have confirmed the issue is not resolved in the latest alpha release (\[instructions\](https://docs.ankidroid.org/manual.html#betaTesting))

---

<div class="post-metadata">

**Author:** ![Anon\_0000](https://avatars.discourse-cdn.com/v4/letter/a/c67d28/32.png) [@Anon\_0000](https://forums.ankiweb.net/u/Anon_0000)\
**Post date:** [May 2, 2025, 10:20am UTC](https://forums.ankiweb.net/t/autoplay-all-audio-on-front-of-card-but-not-back/60073/5 "2025-05-02T10:20:12Z")

</div>

Why use `.click()` anyways? Is there any advantage to just using `.play()` (which works fine for ankidroid and desktop)? I did help another user once set it up in [Conditional Audio Playback - #27 by Anon\_0000](https://forums.ankiweb.net/t/conditional-audio-playback/54841/27) so I do have some experience with `.play()`.

So it should be possible to play all audios using a loop after grabing them with something like a `.querySelector`. The only thing that might be an issue is waiting for audio #1 to finish playing before audio #2 is played. Though I assume it should be solveable with [HTMLMediaElement: ended event - Web APIs | MDN](https://developer.mozilla.org/en-US/docs/Web/API/HTMLMediaElement/ended_event).

---

<div class="post-metadata">

**Author:** ![Eltaurus](https://sea2.discourse-cdn.com/flex002/user_avatar/forums.ankiweb.net/eltaurus/32/10287_2.png) [@Eltaurus](https://forums.ankiweb.net/u/Eltaurus)\
**Post date:** [May 2, 2025, 11:18am UTC](https://forums.ankiweb.net/t/autoplay-all-audio-on-front-of-card-but-not-back/60073/7 "2025-05-02T11:18:58Z")

</div>

Those would only work for audio files inserted as `<audio>` tags instead of Anki’s native `[sound:...]`, which makes it less convenient to add and harder to manage, since one will have to rename all files, adding underscores, and manually keep track of which files in the collection are used and which ones are not.

* * *

> [@Anon\_0000](#):
>
> I did help another user once set it up in [Conditional Audio Playback - #27 by Anon\_0000](https://forums.ankiweb.net/t/conditional-audio-playback/54841/27) so I do have some experience with `.play()`.

Yeah, this kind of threads seems to converge to the same kind of solutions each time 🙂:[Selective autoplay of audio for certain notes - #22 by Eltaurus](https://forums.ankiweb.net/t/selective-autoplay-of-audio-for-certain-notes/47544/22)

---

<div class="post-metadata">

**Author:** ![JRS](https://avatars.discourse-cdn.com/v4/letter/j/dbc845/32.png) [@JRS](https://forums.ankiweb.net/u/JRS)\
**Post date:** [May 3, 2025, 2:30am UTC](https://forums.ankiweb.net/t/autoplay-all-audio-on-front-of-card-but-not-back/60073/8 "2025-05-03T02:30:54Z")

</div>

Thanks! Using {{FrontSide}} works well.

---

<div class="post-metadata">

**Author:** ![system](https://us1.discourse-cdn.com/flex002/uploads/anki2/original/1X/8f1279ababc5879d54e4838989f606cfe55af8c7.jpeg) [@system](https://forums.ankiweb.net/u/system)\
**Post date:** [June 2, 2025, 2:31am UTC](https://forums.ankiweb.net/t/autoplay-all-audio-on-front-of-card-but-not-back/60073/9 "2025-06-02T02:31:42Z")

</div>

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.