檢查值並追加給定值

Question

在我的網址中，我想檢查自動播放是否存在，然後替換值。 在我的iframe中，我有網址https://www.youtube.com/embed/C0DPdy98e4c?width=640 在那個網址中，我想檢查自動播放是否存在。如果不需要在playbutton點擊中追加autoplay = 1。

jQuery(document).ready(function($) { 
 
     $('.playButton').click(function() { 
 
     
 
     alert('play'); 
 
    $('.flex-active-slide iframe').contents().find("iframe")[0].src += "&autoplay=1"; //need to check autoplay and append with src 
 
     $("iframe").src = src.replace(/\&autoplay\=\d/, "&autoplay=" + 1); 
 
     }); 
 

 
     $(".close_icon").click(function() { 
 
     alert('close'); 
 
     $("iframe").src = src.replace(/\&autoplay\=\d/, "&autoplay=" + 0); 
 
     }); 
 
    });

 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="flex-active-slide"> 
 
    <iframe src="https://www.youtube.com/embed/C0DPdy98e4c?width=640"></iframe> 
 
</div> 
 
    <div class="playButton">Play</div> 
 
    <div class="close_icon">Close</div>

Answer 1

jQuery(document).ready(function($) { 
 
     $('.playButton').click(function() { 
 
     
 
     alert('play'); 
 
     if(/\&autoplay\=\d/.test($('.flex-active-slide iframe')[0].src)) { 
 
      $('.flex-active-slide iframe')[0].src = $('.flex-active-slide iframe')[0].src.replace(/\&autoplay\=\d/, "&autoplay=" + 1); 
 
     } else { 
 
      $('.flex-active-slide iframe')[0].src += "&autoplay=1"; //need to check autoplay and append with src 
 
     } 
 
     }); 
 

 
     $(".close_icon").click(function() { 
 
     alert('close'); 
 
     $("iframe")[0].src = $("iframe")[0].src.replace(/\&autoplay\=\d/, "&autoplay=" + 0); 
 
     }); 
 
    });

 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="flex-active-slide"> 
 
    <iframe src="https://www.youtube.com/embed/C0DPdy98e4c?width=640"></iframe> 
 
</div> 
 
    <div class="playButton">Play</div> 
 
    <div class="close_icon">Close</div>

Answer 2

您可以嘗試JavaScript字符串函數的indexOf檢查自動播放所有腦幹

jQuery(document).ready(function($) { 
     $('.playButton').click(function() {  
     var src=$('.flex-active-slide iframe').contents().find("iframe")[0].src; 
     if(src.indexOf("autoplay") == -1){ 
      $('.flex-active-slide iframe').contents().find("iframe")[0].src += "&autoplay=1"; //need to check autoplay and append with src 
     } 
     $("iframe").src = src.replace(/\&autoplay\=\d/, "&autoplay=" + 1); 
     }); 

     $(".close_icon").click(function() { 
     alert('close'); 
     $("iframe").src = src.replace(/\&autoplay\=\d/, "&autoplay=" + 0); 
     }); 
    }); 

Answer 3

我寫了一些可靠的函數供你使用。

用法：autoplayURL(url string, autoplayOn/Off bool);

它返回格式化字符串自動播放設置開啓或關閉。

默認情況下，如果您沒有解析第二個參數，自動播放會打開。

jQuery(document).ready(function($) { 
 
\t $('.playButton').click(function() { 
 
\t \t $("#youtube-iframe").attr("src", autoplayURL($("#youtube-iframe").attr("src"))); 
 
\t }); 
 

 
\t $(".close_icon").click(function() { 
 
\t \t $("#youtube-iframe").attr("src", autoplayURL($("#youtube-iframe").attr("src"), false)); 
 
\t }); 
 
}); 
 
\t \t \t 
 
function autoplayURL(youtubeURL, autoplay) { 
 
\t // Set default value of autoplay 
 
\t if (autoplay === undefined) 
 
\t \t autoplay = true; 
 

 
\t autoplay = autoplay ? 1 : 0; 
 

 
\t // Remove trailing/from URL 
 
\t if (youtubeURL.endsWith("/")) 
 
\t \t youtubeURL = youtubeURL.substr(0, youtubeURL.length - 1); 
 

 
\t // Add ? to end of URL if it doesn't exist 
 
\t if (youtubeURL.indexOf('?') === -1) { 
 
\t \t youtubeURL += "?autoplay=" + autoplay; 
 
\t \t return youtubeURL; 
 
\t } 
 

 
\t var autoplayOpposite = autoplay === 0 ? 1 : 0; 
 

 
\t if (youtubeURL.indexOf('autoplay=') === -1) { 
 
\t \t // If URL does not contain 'autoplay=' then append to URL. 
 
\t \t youtubeURL += "&autoplay=" + autoplay; 
 
\t } else if (youtubeURL.indexOf('autoplay=' + autoplayOpposite) !== -1) { 
 
\t \t // If URL contains 'autoplay=0' then replace it with 'autoplay=1'. 
 
\t \t var firstPart = youtubeURL.substr(0, youtubeURL.indexOf('autoplay=' + autoplayOpposite)); 
 
\t \t var lastPart = youtubeURL.substr(youtubeURL.indexOf('autoplay=' + autoplayOpposite)+10); 
 
\t \t youtubeURL = firstPart + "autoplay=" + autoplay + lastPart; 
 
\t } 
 
\t return youtubeURL; 
 
}

 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="flex-active-slide"> 
 
    <iframe src="https://www.youtube.com/embed/C0DPdy98e4c?width=640" id="youtube-iframe"></iframe> 
 
</div> 
 
    <div class="playButton">Play</div> 
 
    <div class="close_icon">Close</div>

的

Answer 4

指數也可以使用，但如果您的網址中包含單詞自動播放其他地方，那麼它可能彈例如：「https://www.youtube.com/embed/自動播放 C0DPdy98e4c寬度= 640？」。試試這個（假設你總是在URL的末尾添加自動播放）：

jQuery(document).ready(function($) { 
    $('.playButton').click(function() { 

    alert('play'); 
    var srcArr = $('.flex-active-slide iframe')[0].src.split('&') 
    var src = srcArr[srcArr.length-1]; 
$('.flex-active-slide iframe')[0].src = src+"&autoplay=1"; 
    $("iframe")[0].src = src.replace(/\&autoplay\=\d/, "&autoplay=" + 1); 
    }); 

    $(".close_icon").click(function() { 
    alert('close'); 
    $("iframe")[0].src = src.replace(/\&autoplay\=\d/, "&autoplay=" + 0); 
    }); 
}); 

Answer 5

這是我的解決方案。代碼被嚴重評論，所以應該是自我解釋，但讓我知道如果有什麼不清楚。

希望它對你有用。

$('.playButton').click(function() { 
 
    
 
// get the current iframe url. 
 
    var originalSrc = $('.flex-active-slide iframe').attr('src'); 
 
    
 
//check if the autoplay=0 is part of the url. 
 
    var autoplayPos = originalSrc.indexOf("?&autoplay=0") 
 
    if (autoplayPos >= 0){ 
 
    // if it is lets remove it. 
 
    originalSrc = originalSrc.substring(0,autoplayPos); 
 
    } 
 
    
 
    // set the new url to our original url (without autoplay=0) with autoplay=1 apended 
 
    var newSrc = originalSrc + "?&autoplay=1"; 
 
    
 
    // set the iframe source to the new url. 
 
    $('.flex-active-slide iframe').attr('src', newSrc); 
 
}); 
 

 
$(".close_icon").click(function() { 
 
    // get the current iframe url. 
 
    var originalSrc = $('.flex-active-slide iframe').attr('src') 
 
    
 
    // we dont bother checking if auotplay is already there since the site will always start with it not there (i assume). 
 
    
 
    // set new with, replace autoplay=1 with autoplay=0 
 
    var newSrc = originalSrc.replace("?&autoplay=1", "?&autoplay=0"); 
 
    
 
    // set the iframe source to the new url. 
 
    $('.flex-active-slide iframe').attr('src', newSrc); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> 
 
<div class="flex-active-slide"> 
 
    <iframe src="https://www.youtube.com/embed/C0DPdy98e4c?width=640"></iframe> 
 
</div> 
 
<div class="playButton">Play</div> 
 
<div class="close_icon">Close</div>