HTML配音网页制作教程 - 简单易懂 - 常规

以下是一个简单的配音网页的HTML代码示例：

<!DOCTYPE html>
<html lang='en'>
<head>
    <meta charset='UTF-8'>
    <meta http-equiv='X-UA-Compatible' content='IE=edge'>
    <meta name='viewport' content='width=device-width, initial-scale=1.0'>
    <title>配音网页</title>
</head>
<body>
    <h1>配音网页</h1>
    
    <h2>选择角色:</h2>
    <select id='character-select'>
        <option value=''>请选择角色</option>
        <option value='character1'>角色1</option>
        <option value='character2'>角色2</option>
        <option value='character3'>角色3</option>
    </select>
    
    <h2>录制配音:</h2>
    <textarea id='voice-recording' rows='5' cols='30'></textarea>
    <br>
    <button id='submit-recording'>提交配音</button>
    
    <h2>播放配音:</h2>
    <audio id='voice-audio' controls></audio>
    
    <script>
        document.getElementById('submit-recording').addEventListener('click', function() {
            var character = document.getElementById('character-select').value;
            var recording = document.getElementById('voice-recording').value;
            
            if (character && recording) {
                var audioElement = document.getElementById('voice-audio');
                audioElement.src = 'audio/' + character + '.mp3';
                audioElement.play();
            } else {
                alert('请选择角色并录制配音！');
            }
        });
    </script>
</body>
</html>

这个网页包含一个角色选择下拉菜单、一个用于录制配音的文本框、一个提交配音的按钮以及一个用于播放配音的音频元素。用户可以选择角色，录制配音后点击提交按钮，然后点击播放按钮即可播放配音。