iframeの内容をBootstrapボタンで変更するjquery

Question

iframe src urlをブートストラップボタンからクリックして変更します。 javascriptのコードは、従来のボタンで動作しますが、私はjQueryを使ってのiframeを変更するために同じコードを使用するときに何かがうまくいかない： （私も、ページの読み込み時にランダム取得するためにはiframeを希望）

ブートストラップ要素（HTMLページ）

... 
<div class="col-md-6"> 
    <a class="btn btn-primary" id="randomize">sekvanta ekzerco</a> 
</div> 

<div> 
    <iframe id="question" src="url0" width="275" 
          height="650" frameborder="0" allowfullscreen="allowfullscreen"> 
</iframe> 
</div> 

... 
    <script src="application.js"></script> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script> 
    </body> 

application.js

var sources = new Array() 

sources[0] = 'url0' 
sources[1] = 'url1' 
sources[2] = 'url2' 
sources[3] = 'url3' 

var p = sources.length; 

$(document).ready(function(){ 
    var randomSource = Math.round(Math.random()*(p-1)); 
    $('#question').attr('src', 'sources[randomSource]'); 
} 

$('#randomize').click(function() { 

    var randomSource = Math.round(Math.random()*(p-1)); 
    $('#question').attr('src', 'sources[randomSource]'); 
} 

Answer 1

あなたは、単一のQUOTを削除することができますブラウザが式を評価するのではなくリテラルとして解釈するので、sources[randomSource]からのes。

$('#question').attr('src', sources[randomSource]); 

全スニペット：

var sources = new Array() 
 

 
sources[0] = 'url0' 
 
sources[1] = 'url1' 
 
sources[2] = 'url2' 
 
sources[3] = 'url3' 
 

 
var p = sources.length; 
 

 
$('#randomize').click(function() { 
 
    var randomSource = Math.round(Math.random()*(p-1)); 
 
    console.log(sources[randomSource]); 
 
    $('#question').attr('src', sources[randomSource]); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script> 
 

 
<button id="randomize"> 
 
Click me 
 
</button> 
 

 
<div id="question"> 
 
</div>

JSFiddleブートストラップバージョンを実証します。

https://jsfiddle.net/fz6yythy/