Javascript jQuery-在Iframe内部按钮的onclick事件中更改Iframe高度_Javascript_Jquery_Html_Button_Iframe

Javascript jQuery-在Iframe内部按钮的onclick事件中更改Iframe高度

javascript jquery html button iframe

Javascript jQuery-在Iframe内部按钮的onclick事件中更改Iframe高度,javascript,jquery,html,button,iframe,Javascript,Jquery,Html,Button,Iframe,现在，我正在编写一个简单的HTML/jQuery脚本，当我单击iframe-it自身加载的按钮时，我想更改iframe的高度看看我的代码： index.php： <div id="outerdiv"> <iframe src="http://beta.sportsdirect.bg/test/iframe.php" id="inneriframe" scrolling="no" target="_parent"></iframe> </d

现在，我正在编写一个简单的HTML/jQuery脚本，当我单击iframe-it自身加载的按钮时，我想更改iframe的高度

看看我的代码：

index.php：

<div id="outerdiv">
    <iframe src="http://beta.sportsdirect.bg/test/iframe.php" id="inneriframe" scrolling="no"    target="_parent"></iframe>
</div>

iframe.php：

 <HTML>
 <head>
 <script src="//code.jquery.com/jquery-1.10.2.js"></script>
 </head>
    <script type="text/javascript">
    $("#SuperWebF1").click(function(){

        $('#inneriframe, #outerdiv', window.parent.document).css({"height":"450px"});

    })
    </script>
 <div style="display:block;height:300px;">
    <h3>The iframe content</h3>  
        <button type="button" id="SuperWebF1">Click me to resize the holding Iframe!</button>
  </div>


$（“#SuperWebF1”）。单击（函数（）{
$（'#inneriframe，#outerdiv'，window.parent.document）.css（{“height”：“450px”}）；
})
iframe内容
单击我以调整保持Iframe的大小！

下面是index.php的演示：

当您打开它时，您将看到iframe加载的按钮。单击按钮时，iframe不会更改高度

为什么，有错吗

你能帮我把这东西弄好吗

提前谢谢

您需要先获取iframe的内容，然后才能设置单击事件。试试这个-

var iframeDoc = $('#inneriframe').contents().get(0);
$(iframeDoc).on('click', 'SuperWebF1', function() {
       ........... your code here  .............
});

快乐编码

以下是我对您的代码所做的一些更改

//function call needed to make sure page is loaded before javascript runs
$(document).ready(function(){//begin document ready function

//on click event
$(document).on("click","#SuperWebF1",function(){//begin on click event

    //change the height of selected elements
    $('#inneriframe, #outerdiv', window.parent.document).css({"height":"450px"});

    });//end on click event


  });//end document ready function

您正在尝试在按钮元素存在之前将click事件绑定到按钮元素。是否有任何方法可以将脚本放置在iframe外部并使其侦听按钮上的iframe内部有单击？是否有任何方法可以将脚本放置在iframe外部并使其侦听按钮上的iframe内部有单击按钮