JQuery Диалог не может увидеть глобальные переменные

Question

Я погрузочные HTML в диалоговом окне при нажатии на кнопку на

$("button").live('click', function() { 
    var $div = $('<div title="Form"></div>'); 
    $div.load('test.html #formModal').dialog({ 
     width: 900, 
     height: 500 
    }) 
}) 

HTML, из #formModal выглядит

<form id="form"> 
    <input id="input1" type="button" /> 
    <input ... 
    </form> 
    <p id="formEdit"></p> 

На данный момент HTML успешно загружен в диалоговом окне

У меня также есть следующее, которое при щелчке по диалогу #input1 внутри будет содержать текст внутри #formEdit.

var $form = $('#form'); // global variable 
var $formedit = $('#formEdit'); // global variable 
$form.find('#input1').live('click', function(){ 
$formedit.text('test'); //if i do $('#formEdit') instead of $formedit then it works 
}) 

$formedit здесь не работает. Он не передается обработчику кликов. он отлично работает, если HTML был первоначально в body и не загружен в диалог с помощью load(). Чем это вызвано.

Answer 1

Поскольку forModal загружается динамически formEdit не поддерживает обычную загрузку страницы.

Попробуйте вместо этого:

$("button").live('click', function() { 
    var $div = $('<div title="Form"></div>'); 
    $div.load('test.html #formModal', function(){ 
     //#######ASSIGN THE #formEdit once the load is complete 
     $formedit = $('#formEdit'); 
    }).dialog({ 
     width: 900, 
     height: 500 
    }); 

}) 

Answer 2

попробовать что-то вроде:

var $form = $('#form'); // global variable 
var $formedit = $('#formEdit'); // global variable 
$form.find('#input1').live('click',{formedit: $formedit} , function(e){ 

e.data.formedit.text('test'); //if i do $('#formEdit') instead of $formedit then it works 
})