Question

我想从bootstrap按钮点击更改iframe src url。 javascript代码与传统按钮一起使用，但是当我使用相同的代码用jquery更改iframe时出现问题：（我也希望iframe在页面加载时随机出现）

bootstrap元素（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

您可以从sources[randomSource]中删除单引号，因为浏览器会将其解释为文字，而不是评估表达式。

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

完整代码段

＆＃13;

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]);
});

＆＃13;

<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>

＆＃13;

JSFiddle演示Bootstrap版本。

https://jsfiddle.net/fz6yythy/

使用Bootstrap按钮单击和jquery更改iframe内容

1 个答案: