Chèn video HTML5 bằng JavaScript cho iPad

Question

Tôi đang cố gắng chèn video vào HTML bằng cách sử dụng jQuery cho iPad nhưng tất cả những gì tôi thấy là màn hình màu đen. Nếu tôi thêm thẻ video trực tiếp vào trang HTML, tất cả dường như hoạt động tốt.

Dưới đây là những gì tôi có trong JavaScript của mình và tôi gọi điều này bằng cách sử dụng hàm cho sự kiện onClick.

var html = ""; 
html += '<video id="someVideo" width="'+settings.width+'" height="'+settings.height+'" controls="controls">'; 
html += '<source src="'+url+'" type="video/mp4" />'; 
html += '</video>'; 
$("#videoDiv").html(html); 

Nếu tôi tạo ra một thẻ video ngay bên trong tất cả mọi thứ cơ thể dường như được làm việc tốt

<video width=708px height=300px controls="controls"><source src="video.mp4" type="video/mp4"></video> 

Lý do tôi đang lên kế hoạch một Javascript là tôi có vài video trên cùng một trang và muốn người dùng lựa chọn một đoạn video được xem như phản đối một video duy nhất trên một trang ... Bất cứ ý tưởng xung quanh đó cũng sẽ giúp

Bất kỳ trợ giúp sẽ được đánh giá cao Cảm ơn

Answer 1

Lý do tôi đang lên kế hoạch một Javascript là tôi có vài video trên cùng một trang và muốn người dùng lựa chọn một đoạn video được xem như phản đối một video duy nhất trên một trang ... Bất cứ ý tưởng xung quanh điều đó cũng sẽ giúp

Đặt tất cả các video trên trang, mỗi video có kiểu "display: none". Sau đó .show() div thích hợp trên sự kiện nhấp chuột.

Answer 2

Có lỗi trong webkit của iPad ngăn các yếu tố video được tạo tự động tải đúng cách.

Để làm được việc này thiết lập các thuộc tính nguồn và gọi phương thức yếu tố hình tải sau khi bạn đã thiết lập các html

var html = ""; 
html += '<video id="someVideo" width="'+settings.width+'" height="'+settings.height+'" controls="controls">'; 
html += '<source src="'+url+'" type="video/mp4" />'; 
html += '</video>'; 
$("#videoDiv").html(html); 

$('#someVideo').attr('src', url); 
$('#someVideo')[0].load(); 

Answer 3

ampts Re trả lời: xin lưu ý gọi load() trên các yếu tố video chỉ hoạt động nếu bạn mã được kích hoạt bởi hành động của người dùng, như trình xử lý nhấp chuột.

Đối với tôi điều này không có tác dụng vì dường như táo không nghĩ rằng trình xử lý lịch sử (thay đổi băm) là trình xử lý được kích hoạt của người dùng.

Để biết thêm chi tiết see apples documentation on javascript and the video element