Thanks for the info! After a lot of playing around I finally found out what the problem was - using <button onclick="callfunction()"> seems to cause the page to refresh. Using <span onclick="callfunction()"> gets round the problem. I guess there is some kind of conflict with the buttons in the atto framework.
Here's the code in case anyone else has the same problem:
<audio id="audioTrack"> //leaving out the 'controls' attribute to hide the element
<source src="path_to_file.mp3" type="audio/mpeg">
<span class="fakeButton" onclick="document.getElementById('audioTrack').play()">Click here to start audio</span>
It's true that the code inspector allows students to cheat, but they will be doing exams in a monitored environment... the aim of moving to computer based is cut down on the marking!