JavaScript phát đồng thời nhiều tệp âm thanh

Giả sử bạn muốn tạo một ứng dụng đố vui. Trong đó, nếu bạn nhấp vào tùy chọn sai, âm thanh sẽ được phát ở chế độ nền cho biết “câu trả lời sai”. Nhưng nếu bạn bấm sai đồng thời hai hoặc nhiều tùy chọn, bạn sẽ không thể nghe thấy âm thanh vì nhiều lần bấm sai câu trả lời cùng một lúc. Vì vậy, làm thế nào để giải quyết vấn đề này

Trong bài viết này, bạn sẽ xem liệu bạn có thể phát cùng một âm thanh nhiều lần cùng lúc với HTML5 hay không

câu trả lời là Có

Có hai phương pháp để làm như vậy

Hãy cho chúng tôi xem các phương pháp là gì trong các phần tiếp theo của chúng tôi

Sử dụng phương thức cloneNode()

Sử dụng phương pháp này, chúng tôi chỉ cần tạo bản sao hoặc sao chép âm thanh mà chúng tôi muốn lặp lại

Thí dụ

   
 cloneNode() method 


    cloneNode() method 
    Options 
   
      
      
   
   

 

Khi nhấp vào nút tùy chọn, âm thanh sẽ được sao chép và phát do bạn đã đặt điều khiển tự động phát. Bạn nhấp vào nút bao nhiêu lần thì bấy nhiêu lần âm thanh sẽ được phát đồng thời.  

thẻ được sử dụng để thêm các nút có thể nhấp vào trang HTML của bạn. Nó có các thuộc tính khác nhau như loại, tên, hình thức, giá trị, tự động lấy nét, hình thức, v.v. ,

Thí dụ

Gửi

sự kiện onclick xảy ra khi người dùng nhấp vào phần tử chứa sự kiện đó

cú pháp

• Trong HTML,

• Trong Javascript, đối tượng. onclick = myFunction() { mã};

Thí dụ

 Example 

thẻ được sử dụng để thêm âm thanh vào trang HTML của bạn. Nó có các thuộc tính như id, điều khiển. Thuộc tính điều khiển được sử dụng để thêm các điều khiển âm thanh như phát, tạm dừng, âm lượng. Thuộc tính autoplay được sử dụng để phát âm thanh tự động

Phần tử cho phép người dùng chỉ định tệp nguồn âm thanh và loại âm thanh sẽ được phát

cú pháp

Thí dụ

Phương thức cloneNode() được sử dụng để tạo các bản sao của phần tử HTML. Nó sao chép tất cả các thuộc tính và giá trị của chúng

cú pháp

element.cloneNode()

Tham số

true, false

Nếu bạn muốn tạo bản sao của các phần tử con, thì hãy giữ tham số là true. Nếu không, hãy đặt nó thành false

Thí dụ

Phương thức appendChild() cho phép người dùng thêm một phần tử hoặc nút trở thành nút con cuối cùng của nút hoặc phần tử cha

Trong mã của chúng tôi, nó được sử dụng để nối các bản sao của âm thanh vào phần thân của tài liệu

cú pháp

________số 8

Tham số

nút hoặc phần tử sẽ được thêm vào

Thí dụ

Tạo một

phần tử và nối nó vào phần thân của tài liệu.

Bằng cách tải trước nhiều phiên bản âm thanh

Một cách khác để phát âm thanh nhiều lần có thể là tải trước nhiều phiên bản của âm thanh. Trong phần này, chúng ta hãy tìm cách tải trước nhiều phiên bản âm thanh -

Thí dụ

0

Nơi đây,

Biến n được khai báo để xác định số lần bạn muốn lặp lại âm thanh

Âm thanh biến đổi tạo ra một mảng cho tất cả các âm thanh

vòng lặp for được sử dụng để có n bản sao khác nhau của âm thanh

Phương thức push() được sử dụng để thêm các phần tử mới vào một mảng

Thí dụ

1

Đối tượng Audio() tạo và trả về một âm thanh HTML mới

cú pháp

2

Phát biến nói về phiên bản âm thanh nào được phát tại thời điểm đó. Để làm điều này, một lần nữa chúng tôi đã sử dụng vòng lặp for

playSound là một chức năng trong đó chúng tôi yêu cầu trình duyệt phát âm thanh

Thuộc tính âm lượng đặt âm lượng của âm thanh hiện đang phát

cú pháp

3

Giá trị

đó là số xác định âm lượng. Nó phải nằm trong khoảng từ 0 đến 1

Thí dụ

1 là âm lượng cao nhất, 100% trong khi 0 là âm lượng thấp nhất, tắt tiếng

&& là toán tử logic. Nếu cả hai toán hạng boolean là true, thì toán tử trả về true, nếu không thì trả về false

Thí dụ

5

++ play[id] được sử dụng để chỉ định trình duyệt rằng sau mỗi lần phát âm thanh, sẽ có một khoảng tăng để phiên bản khác được phát

Phần kết luận

Trong bài viết này, có nhiều phương pháp và cách tiếp cận khác nhau để phát cùng một âm thanh nhiều lần cùng lúc bằng HTML5 và Javascript

Tôi đã tìm kiếm vấn đề này và thấy điều này. https. // stackoverflow. com/câu hỏi/25654558/html5-js-play-same-sound-multiple-times-at-the-same-time

Nó dường như hữu ích, ngoại trừ sau đó một câu hỏi xuất hiện

Nếu tôi thực hiện cloneNode(), nó sẽ sao chép âm thanh VÀ dữ liệu âm thanh hiện được tải hay nó sẽ phải tải lại dữ liệu?

Các rãnh âm thanh là một tính năng của video HTML5 để cung cấp các lựa chọn rãnh âm thanh thay thế cho người dùng, để có thể phát một rãnh khác với rãnh chính. Băng hình. js cung cấp triển khai các bản âm thanh trên nhiều trình duyệt, cung cấp công nghệ phát lại hỗ trợ các bản âm thanh

Các bản âm thanh được hỗ trợ trong Video. công cụ phát lại MSE của js cho HLS và DASH. Safari cũng hỗ trợ các bản âm thanh để phát lại HLS và MP4 gốc. Các trình duyệt khác không hỗ trợ các bản âm thanh để phát lại gốc bao gồm cả MP4, do đó, không thể hoạt động với các bản âm thanh MP4 trong Chrome hoặc Firefox chẳng hạn

• Không thể thêm các bản âm thanh thông qua HTML như bạn có thể làm với các bản nhạc văn bản. Chúng phải được thêm vào theo chương trình
• Băng hình. js chỉ lưu trữ các biểu diễn theo dõi. Chuyển đổi các bản âm thanh để phát lại không được xử lý bởi Video. js và phải được xử lý ở nơi khác - ví dụ: http-streaminfg xử lý chuyển đổi các bản âm thanh để hỗ trợ lựa chọn bản nhạc thông qua giao diện người dùng

Khi một bản nhạc được bật hoặc tắt trên

6, sự kiện

7 sẽ được kích hoạt. Bạn có thể lắng nghe sự kiện đó và làm điều gì đó với nó

GHI CHÚ. Lựa chọn

8 ban đầu (thường là rãnh chính được chọn) sẽ không kích hoạt sự kiện

7

Giả sử một trình phát đã tồn tại và có bản âm thanh mà bạn muốn xóa, bạn có thể thực hiện thao tác như sau

Để biết thông tin đầy đủ hơn, hãy tham khảo Video. tài liệu API js, cụ thể

•  Example 
  

  0

• 6

• 8

Lớp này dựa trên tiêu chuẩn

8 và có thể được sử dụng để tạo các đối tượng rãnh âm thanh mới

Mỗi thuộc tính bên dưới có sẵn dưới dạng tùy chọn cho hàm tạo

8

độ nét tiêu chuẩn

Mã định danh duy nhất cho bản nhạc này. Băng hình. js sẽ tạo một cái nếu không được cung cấp

độ nét tiêu chuẩn

Băng hình. js hỗ trợ các giá trị

 Example 

5 tiêu chuẩn cho

70

• 71. Một sự thay thế khả dĩ cho đường đua chính

• 72. Mô tả âm thanh của một bản nhạc video

• 73. Bản âm thanh chính cho video này

• 74. Bản âm thanh chính, trộn với các mô tả âm thanh

• 75. Bản dịch của bản âm thanh chính

• 76. Bình luận về bản âm thanh chính, e. g. bình luận của giám đốc

• 77 (mặc định). Không có loại rõ ràng hoặc loại do siêu dữ liệu của bản nhạc cung cấp không được tác nhân người dùng nhận dạng

độ nét tiêu chuẩn

Nhãn cho bản nhạc sẽ được hiển thị cho người dùng. Ví dụ: trong menu liệt kê các ngôn ngữ khác nhau có sẵn dưới dạng bản âm thanh thay thế

độ nét tiêu chuẩn

Mã BCP 47 hợp lệ cho ngôn ngữ của bản âm thanh, e. g.

78 cho tiếng Anh hoặc

79 cho tiếng Tây Ban Nha

Để biết các bản dịch ngôn ngữ được hỗ trợ, vui lòng xem thư mục ngôn ngữ (/lang) nằm trong Video. js và tham khảo hướng dẫn ngôn ngữ để biết thêm thông tin về các ngôn ngữ trong Video. js

độ nét tiêu chuẩn

Có nên phát bản nhạc này hay không

Trong Video. js, chúng tôi chỉ cho phép bật một bản nhạc tại một thời điểm; . Mặc dù thông số kỹ thuật cho phép bật nhiều bản nhạc, nhưng Safari và hầu hết các triển khai chỉ cho phép bật một bản âm thanh tại một thời điểm