32

I have a jquery function and I need to call it after opening the website in an Iframe.

I am trying to open a weblink in an Iframe and after opening it I need to call the below function. So how do I do that?

Here is my function:

<script type="text/javascript">
       $(document).ready(function(){
           $("#<%=Button1.ClientID%>").click(function (event) {

            $('#<%=TextBox1.ClientID%>').change(function () {
                $('#various3').attr('href', $(this).val());
            });
            $("#<%=Button2.ClientID%>").click();
        });
      })
    function showStickySuccessToast() {
        $().toastmessage('showToast', {
            text: 'Finished Processing!',
            sticky: false,
            position: 'middle-center',
            type: 'success',
            closeText: '',
            close: function () {

            }
        });
    }

    </script>

This is my button to open the link in an IFrame:

<a id="various3" href="#"><asp:Button ID="Button1" 
runat="server" Text="Button" OnClientClick="Button2_Click"/></a>

Actually this is the simple Page I'm having:

enter image description here

And this is the message enter image description here

4
  • Can't you just use an onclick handler? I mean, if the iframe loads onclick, can't you set the function to run onclick too?
    – bozdoz
    Commented Nov 21, 2011 at 18:12
  • Yes I can but it just flashes both of them at a time.
    – coder
    Commented Nov 21, 2011 at 18:14
  • It looks like you are using aspx (<asp: ...>). If so, you should have tagged the question as aspx too. Commented Nov 21, 2011 at 18:39
  • No problem thanks for the info and I rectified it and got it working now.
    – coder
    Commented Nov 21, 2011 at 18:40

4 Answers 4

122

You can just use the normal setTimeout method in JavaScript.

ie...

setTimeout( function(){ 
    // Do something after 1 second 
  }  , 1000 );

In your example, you might want to use showStickySuccessToast directly.

5
  • First thanks for your reply and If I do this it just flashes both of them at a time though I have set the time interval to 9sec.
    – coder
    Commented Nov 21, 2011 at 18:15
  • @Stein G. Strindhaug-The Iframe as well as the message.
    – coder
    Commented Nov 21, 2011 at 18:21
  • @user944919 then whatever css class you use to select the element for the effect probably matches both of the elements... Commented Nov 21, 2011 at 18:24
  • And if you need a clear timeout, you should define var to setTimeout and put this code : clearTimeout(timer); Commented May 3, 2018 at 9:27
  • aaha... this seems simple for me.
    – gumuruh
    Commented Aug 5, 2019 at 6:23
3

If you could show the actual page, we, possibly, could help you better.

If you want to trigger the button only after the iframe is loaded, you might want to check if it has been loaded or use the iframe.onload:

<iframe .... onload='buttonWhatever(); '></iframe>


<script type="text/javascript">

    function buttonWhatever() {
        $("#<%=Button1.ClientID%>").click(function (event) {
            $('#<%=TextBox1.ClientID%>').change(function () {
                $('#various3').attr('href', $(this).val());
            });
            $("#<%=Button2.ClientID%>").click();
        });

        function showStickySuccessToast() {
            $().toastmessage('showToast', {
                text: 'Finished Processing!',
                sticky: false,
                position: 'middle-center',
                type: 'success',
                closeText: '',
                close: function () { }
            });
        }
    }

</script>
6
  • I have updated my question you can have a view at that what I mean!And I'm using fancybox Iframe to display the webpage.
    – coder
    Commented Nov 21, 2011 at 18:31
  • I don't know much about interacting with frames but I'll risk: how about change the click function to $('#iframeID').child('#button').click()? Commented Nov 21, 2011 at 18:44
  • Actually I made it working by giving set time out to button instead of function as var timer = setTimeout(function () { $("#<%=Button2.ClientID%>").click(); }, 9000); and working fine.Anyways thanks for your valuable answer I will try with your suggestions.
    – coder
    Commented Nov 21, 2011 at 18:46
  • You answer is also the best one but I'm not using normal Iframes so this is also a good option who uses thes normal Iframe with Asp.Net.
    – coder
    Commented Nov 21, 2011 at 18:49
  • +1 as you have tried so much for me and giving me new way to think.
    – coder
    Commented Nov 21, 2011 at 18:50
0

try This

setTimeout( function(){ 
    // call after 5 second 
  }  , 5000 );
2
  • Please include an explanation of how its differ from accepted answer and why this solves the problem would really helps to improve the quality of your post, and probably result in more up-votes.
    – Android
    Commented Aug 1, 2019 at 7:28
  • Also, let's not forget the fact that this is an almost 8-year-old question, is already answered, and has an accepted answer. Plus, this answer is really poor, doesn't explain anything, or contribute anything new (a duplicate), --- and well, read the first sentence, again.
    – akinuri
    Commented Aug 1, 2019 at 13:58
0

If you want to call something after N of seconds use the below way.

setTimeout( function(){ 
    alert("welcome");
    }  , 2000 );

and you can call a function in this way :

 setTimeout(showMessage, 2000 );
    
    function showMessage(){
      alert("welcome");
    }

If You want to call a function for each N of seconds. use this way :

setInterval( function(){ 
    // execute me each 2 seconds 
  }  , 2000 );

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.