including an html file in another html file and JS

Question

Suppose i have two html files, one.html and two.html. I want to include two.html in one.html, so i have done that like this,

<script>
        $(function(){
            $("#middle").load("two.html");
        });
</script>

I have a script file say, script.js which i am loading at the end of one.html as

<script src="scripts/script.js" ></script>

In that file I am writing function to be implemented on elements of two.html. But the functions are not being applied on two.html. So, what's the correct way of doing this?

possible duplicate of Event binding on dynamically created elements? — Quentin
– Quentin, Commented Feb 17, 2014 at 13:15

Abudayah · Accepted Answer · 2014-02-17 13:18:59Z

2

Use $.get jQuery function

$.get( "tow.html", function( data ) {
  $( "#middle" ).html( data );
  alert( "Load was performed." );
});

answered Feb 17, 2014 at 13:18

Abudayah

3,8837 gold badges42 silver badges61 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Jav Rok · Accepted Answer · 2014-02-17 13:24:10Z

1

Why don't you use an (hidden?) iframe ? If it's located on the same server, you can access parent page (one.html)'s functions and elements:

window.parent.example_function();

or play with its DOM elements.

answered Feb 17, 2014 at 13:24

Jav Rok

3311 silver badge8 bronze badges

Comments

Bilal · Accepted Answer · 2014-02-17 13:30:26Z

0

To add events on dynamically loaded elements you need to use .live() function in jquery < 1.9 and .on() if jquery >= 1.9

.live()

.on()

answered Feb 17, 2014 at 13:30

Bilal

2,6733 gold badges29 silver badges41 bronze badges

Comments

fragmentedreality · Accepted Answer · 2014-02-17 15:15:49Z

0

You can first load your second pages content and include the javascript only after the additional HTML was included.

$.get("two.html", function(data) {
    $('#middle').html(data);
    $('head').append($('<script>').attr('type', 'text/javascript').attr('src', 'scripts/script.js'));
});

answered Feb 17, 2014 at 15:15

fragmentedreality

1,31310 silver badges33 bronze badges

Collectives™ on Stack Overflow

including an html file in another html file and JS

4 Answers 4

Comments

Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related