Question

我有一个带输入框的页面，用户将在其中输入一个URL，然后将此URL添加为多个IFRAMES的SRC。但我无法这样做。任何人都可以告诉我这里有什么不对，甚至是即兴创作。

甚至可以使用FORM Tag和Submit按钮管理它？

＆＃13;

  var frametest = $('#test-url').val();
  var urlproto = 'http://';
  $('#get-url-btn').click(function() {
    $('.demo-frame').attr('src', urlproto + frametest);
  });

＆＃13;

.demo-frame {
  width: 200px;
  height: 200px;
  overflow: hidden;
  overflow-y: auto;
  margin: 15px;
  float: left;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div class="form-group">
  <input type="url" id="test-url" placeholder="Enter URL">
  <button type="button" id="get-url-btn">Check</button>
</div>
<div class="demo">
  <iframe class="demo-frame" src=""></iframe>
  <iframe class="demo-frame" src=""></iframe>
  <iframe class="demo-frame" src=""></iframe>
  <iframe class="demo-frame" src=""></iframe>
  <iframe class="demo-frame" src=""></iframe>
  <iframe class="demo-frame" src=""></iframe>
</div>

＆＃13;

Answer 1

您正在检索该输入文本的空值，而是将您的js代码设为：*您可以使用此网址 www.example.com

进行测试

var urlproto = 'http://';
$('#get-url-btn').click(function () {
    var frametest = $('#test-url').val();
    $('.demo-frame').attr('src', urlproto + frametest);
});

但是，由于'X-Frame-Options'到'SAMEORIGIN'或DENY

，这可能无效

JSFiddle

Answer 2

你过早采用frametest变量把它放在click（）函数

中

  var urlproto = 'http://';
  $('#get-url-btn').click(function() {
    var frametest = $('#test-url').val();
    $('.demo-frame').attr('src', urlproto + frametest);
  });

无法获取输入值并将其附加到iframe src

2 个答案: