Elemento de cambios de contenido cargado con Ajax en el documento que lo llamó

I have a question about jquery and ajax

I have 2 html files and 1 js

index.html

<h1><div id="parent_header">This is parent header</div></h1>

<button id="my_button">Click here to load child.html</button>

<div id="result"></div>

niño.html

<button id="child_button">This button should change parent header</button> <p />

now, my_button from index.html open child.html and loads it into result div :

$(document).ready(function() {
$("#my_button").click(function() {
    $.ajax({
        url: "child.html",
        dataType: "html",
        success: function(result) {
            $("#result").html(result);
        }
    });
});
});

successfully. Now I want that child_button from child.html change parent header in index.html. How to achieve that ajax-loaded-content changes something in document that called it? (not using iframe)

demo: http://www.lobart78.byethost24.com/ (not possible on jsfiddle)

Gracias

preguntado el 05 de mayo de 13 a las 17:05

Add this to the success function $("#child_button").on("click",function() { ("#parent_header").text("Child changed this text"); }); o tienen $(document).on("click","child_button",function... in the parent -

1 Respuestas

$(document).ready(function() {
$("#my_button").click(function() {
    $.ajax({
        url: "child.html",
        dataType: "html",
        success: function(result) {
            $("#result").html(result);
            $("#child_button").on("click",function() { $("#parent_header").html("just changed for horror!"); });
        }
    });
});
});

contestado el 05 de mayo de 13 a las 18:05

No es la respuesta que estás buscando? Examinar otras preguntas etiquetadas or haz tu propia pregunta.