将jquery变量传递给iframe src

时间:2015-11-05 10:57:29

标签: javascript jquery html iframe

我想将从文本框中获取的值传递给我的iframe的src。我使用以下代码从文本框中获取值,在按钮单击它应该传递给iframe src并替换查询:'*'与传递的变量,即*应该被替换。 如何处理? Foloowing是带有html代码的iframe

 <iframe src="http://localhost:5601/#/dashboard/New-Dashboard?embed&_a
=(filters:!(),panels:!((col:1,id:env,row:1,size_x:4,size_y:3,type:visualization)
,(col:5,id:env-2,row:1,size_x:4,size_y:3,type:visualization),(col:9,id:env-3,
row:1,size_x:4,size_y:3,type:visualization)),query:(query_string:(analyze_wildcard:
!t,query:'*')),title:'New%20Dashboard')&_g=(refreshInterval:(display:Off,pause
:!f,section:0,value:0),time:(from:now%2Fy,mode:quick,to:now%2Fy))" height="600" 
width="800" id="myframe"></iframe>



<!DOCTYPE html>
<html>
<head>
  <title>jQuery With Example</title>
  <script src="http://code.jquery.com/jquery-1.9.1.js" type="text/javascript"></script>
  <script type="text/javascript">
    $(function () {
      $('.btnGetName').click(function (event) {
        var name = $('.txtName').val();
        alert(name);
      });
    });
  </script>
</head>
<body>
   <div>
    <input type="text" class="txtName" value="hello" id="querypass"/><br />
    <button class="btnGetName">Get Name</button>
  </div>
</body>
</html>

2 个答案:

答案 0 :(得分:0)

试试这个

&#13;
&#13;
var src = $('#myframe').attr('src');
var newSrc = src.replace("query:'*'", "query:'" + name + "'");
$('#myframe').attr('src', newSrc);
&#13;
&#13;
&#13;

答案 1 :(得分:0)

您可以尝试以下代码:

注意:假设您的<iframe>位于同一HTML文档中:

$('.btnGetName').click(function (event) {
        var name = $('.txtName').val();
        alert(name);
        var iframeObj = $("#myframe");
        var srcString = iframeObj.attr("src");
        srcString = srcString.replace("query:'*'","query:'"+name+"'");
        iframeObj.attr("src",srcString );
});

请确保您不在文字栏中输入单引号。