HTML5에 매개 변수 전달하기

일부 동영상을 표시하기 위해 무들은 사용하고 있습니다. 동영상 플레이어는 필자에게 동영상을 빨리 감기를 허용 할 수 없도록 필기 뷰어가 컨트롤을 제한해야했습니다. 약 30 개의 비디오가 있으며 각각의 HTML5 페이지는 재생할 비디오의 이름을 제외하고는 동일합니다. 따라서 동영상의 이름을 일반 동영상 플레이어 HTML5 파일로 전달하고 싶습니다.HTML5에 매개 변수 전달하기

이러한 페이지 중 하나에 대한 나의 HTML5 코드 (그들이이 토론 중요하지 않습니다으로 제거 된 사용자 지정 컨트롤을위한 섹션) 다음과 같습니다 : 30 개 다른 HTML5 파일을하는 것보다 그래서 오히려

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="utf-8"> 
    <link rel="stylesheet" href="style.css"> 
    <link rel="stylesheet" media="only screen and (max-device-width: 1024px)" href="style-ipad.css" type="text/css" /> 
</head> 
<body> 
    <div id="video-container"> 
     <video id="video1" autoplay poster="loading.jpg" preload="auto" oncontextmenu="return false;" > 
       <source src="videos\mikethefrog.mp4" type="video/mp4" /> 
       <source src="videos\mikethefrog.webm" type="video/webm" /> 
       <source src="videos\mikethefrog.ogv" type="video/ogg" /> 
     </video> 
    </div> 
    <script src="script.js"></script> 
</body> 
</html>

을 , 각각 다른 기본 이름 (이 경우 3 개의 다른 확장자가있는 "mikethefrog")이있는 기본 이름을 HTML5에 "http://www.mysite.com/videoplayer.html?video=mikethefrog"줄을 따라 전달하려면 HTML5를 사용해야합니다. 해당 이름을 빼고 위의 HTML5 일반 버전에서 해당 이름을 대체하여 세 가지 동영상 파일 형식 확장자를 추가하십시오.

하나의 가능한 경로는 자바 스크립트에서이 매개 변수를 가져와 세 가지 유형의 비디오 파일에 대한 세 가지 변수를 작성하는 것입니다.하지만 src 매개 변수에 변수 이름을 입력하는 방법은 무엇입니까?

모든 도움말 또는이를 수행하는 방법에 대한 포인터를 제공해 주시면 대단히 감사하겠습니다. GET 매개 변수를 검색하기위한

감사

출처

2014-01-15 user2574497

당신이 자바 스크립트 함수를 사용할 수 있습니다

function getParameterByName(name) { 
    name = name.replace(/[\[]/, "\\\[").replace(/[\]]/, "\\\]"); 
    var regex = new RegExp("[\\?&]" + name + "=([^&#]*)"), 
    results = regex.exec(location.search); 
    return results == null ? "" : decodeURIComponent(results[1].replace(/\+/g, " ")); 
}

은 HTML에 ID 년대를 추가합니다.

<div id="video-container"> 
    <video id="video1" oncontextmenu="return false;" > 
      <source id="videoMp4"src="" type="video/mp4" /> 
      <source id="videoWebm"src="" type="video/webm" /> 
      <source id="videoOgg" src="" type="video/ogg" /> 
    </video> 
</div>

및 비디오 이름 교체에 대한 JQuery와 사용

$(document).ready(function(){ 
    var videoname = getParameterByName("video"); 
    if(videoname) {   
     var url = 'videos\\' + videoname; 

     $('#videoMp4').attr('src',url + ".mp4"); 
     $('#videoWebm').attr('src',url + ".webm"); 
     $('#videoOgg').attr('src',url + ".ogg"); 

     var player = document.getElementById('video1'); 
     player.load(); 
     player.play(); 
    } 
});

출처

2014-01-15 19:01:30 MamaWalter

와우,이 아름다운 물건을. 나는 그것을 이해한다고 생각하지만 그것을 구현하는 데 어려움을 겪고있다. 이것은 JQuery에 처음 노출 된 것이므로 어리석은 질문을해야합니다. 세 번째 상자의 JQuery 코드와 같은 파일의 첫 번째 상자에 자바 스크립트 코드가 있습니까? jquery 파일을 다운로드하고 내 HTML 본문에 몇 줄을 추가했습니다. \t \t – user2574497

또한 비디오가 로딩되지 않는 것처럼 보이기 때문에 분명히 재생할 수 없습니다. 내가 얻는 것은 빈 화면이다. 거기에 디버깅을 위해 코드를 넣으려고했으나 실패했습니다. – user2574497

예, 모든 자바 스크립트를 파일에 넣을 수 있습니다. 그리고 jquery를 위해 다음을 추가 할 수 있습니다 :''. 이 모든 것이 PHP로 정말 쉽습니다. – MamaWalter

HTML5에 매개 변수 전달하기

답변

관련 문제