जावास्क्रिप्ट में छुपाएं/दिखाएं - यूट्यूब आईफ्रेम वीडियो

Question

खेलना बंद करें मैंने वीडियो एम्बेड करने के लिए आईफ्रेम फ़ंक्शन का उपयोग किया है, और मैं जावास्क्रिप्ट के माध्यम से सामग्री और वीडियो छुपा रहा/दिखा रहा हूं।

मेरे पास एक समस्या है। जब मैं पहले वीडियो पर खेलता हूं, और फिर पहले को रोकने के बिना अगले पर क्लिक करता हूं, तो पहला वाला खेल खेलता रहता है।

नई सामग्री दिखाते समय, "पृष्ठभूमि" में वीडियो को रोकने के लिए मैं क्या कर सकता हूं?

$(function(){ 
    $("#link1").click(show1); 
}); 

function show1(){ 
    $("#pic1").fadeIn(); 
    $("#pic2").hide(); 
} 

मैं सिर्फ इस सरल JavaScript फ़ंक्शन, जहाँ "pic1" और "pic2" आईडी div की आईडी का उपयोग कर रहा है, वीडियो में एम्बेडेड रहे हैं।

मैं बस नहीं कर पा रहे इसे काम करने के लिए। मैंने हटाने की कोशिश की, लेकिन फिर आप वीडियो को फिर से नहीं देख सकते हैं।

Answer 1

यह अतिरिक्त फ़ाइलों को लोड किए बिना YouTube प्लेयर एपीआई का कार्यान्वयन है। यह काम प्राप्त करने के लिए, आपको विशेषता ?enablejsapi=1 के साथ अपने सभी की src विशेषता को प्रत्ययित करना होगा।

उदाहरण (मैं पठनीयता के लिए कुछ लाइनों पर कोड को तोड़ दिया, आप सुरक्षित रूप से लाइनब्रेक छोड़ सकते हैं):

<div id="pic3"> 
    <iframe width="640" height="390" 
      src="http://www.youtube.com/embed/Xub4grFLbQM?enablejsapi=1" 
      frameborder="0" allowfullscreen></iframe> 
</div> 

<div id="tS2" class="jThumbnailScroller"> 
.. Removed your code for readability.... 
    <a href="#vid3" id="link3"><img src="images/thumbs/player2.jpg" height="85"/></a> 
    .... 

जावास्क्रिप्ट + jQuery कोड:

$(function() { 
    /* elt: Optionally, a HTMLIFrameElement. This frame's video will be played, 
    *  if possible. Other videos will be paused*/ 
    function playVideoAndPauseOthers(frame) { 
     $('iframe[src*="http://www.youtube.com/embed/"]').each(function(i) { 
      var func = this === frame ? 'playVideo' : 'pauseVideo'; 
      this.contentWindow.postMessage('{"event":"command","func":"' + func + '","args":""}', '*'); 
     }); 
    } 
    $('#tS2 a[href^="#vid"]').click(function() { 
     var frameId = /#vid(\d+)/.exec($(this).attr('href')); 
     if (frameId !== null) { 
      frameId = frameId[1]; // Get frameId 
      playVideoAndPauseOthers($('#pic' + frameId + ' iframe')[0]); 
     } 
    }); 
}); 

की [वीडियो जीता