jQuery对话框看不到全局变量

Question

当按钮被点击时，我正在加载HTML对话框

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

#formModal的HTML看起来像

  <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在这里不起作用。它没有被传递给click处理程序。如果HTML最初是在body中，而不是在使用load()的对话框中加载，则可以正常工作。是什么导致了这一切。

Answer 1

由于forModal是动态加载的，所以不能在常规页面加载时使用。

试试这个:

$("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
})