2

背景：
在页面上使用 php 动态创建具有行的表。使用jquery-ui-1.8.14.custom.min.js和jquery-1.5.1.min.js

目标： 我希望能够单击一行，该行将使用来自的新内容更新 Jquery Ui 对话框 div一个 php 页面，然后在 Jquery Ui 对话框中显示此内容。

$(function(){
  $('tr').live('click', function(){
    $('.ui-dialog').load('<?php echo base_url();?>index.php/a/b/1');
    $('.ui-dialog').dialog('open');
  });
});

此代码使对话框出现和消失的速度非常快而不会停止。我还尝试了以下我认为可行的方法：

$(function(){
  $('tr').live('click', function(){
    $('.ui-dialog').load('<?php echo base_url();?>index.php/a/b/1',
      function(){
        $('.ui-dialog').dialog('open')
    });
  });
});

对话框代码：

$(function(){$('.ui-dialog').dialog({
        autoOpen: false,
        width: 600,
        draggable: true,
        resizable: true,
        open: function(){
                        $('.ui-widget-overlay').fadeIn();},
        beforeClose: function(){
                        $('.ui-widget-overlay').fadeOut();},
        show: "fade",
        hide: "fade", 
        buttons: {
        "Back to search": function() { 
            $(this).dialog("close"); }
        }
    })});

很感谢任何形式的帮助。谢谢。

4

2 回答 2

1

当您初始化时：

$(function(){$('.ui-dialog').dialog({
    autoOpen: false,
    width: 600,
    draggable: true,
    resizable: true,
    open: function(){
                    $('.ui-widget-overlay').fadeIn();},
    beforeClose: function(){
                    $('.ui-widget-overlay').fadeOut();},
    show: "fade",
    hide: "fade", 
    buttons: {
    "Back to search": function() { 
        $(this).dialog("close"); }
    }
})});

.ui-dialog当您.load()删除它时，它会将 HTML 添加到其中。

您需要做的是将初始化代码放在ajax 加载之后，或者：

$(function(){
  $('tr').live('click', function(){
    $('.ui-dialog .ui-dialog-content').load('<?php echo base_url();?>index.php/a/b/1',
      function(){
        $('.ui-dialog').dialog('open')
    });
  });
});

http://jsfiddle.net/hgeYs/4/

于 2011-07-22T07:26:39.427 回答
0

像这样的东西

$(function() {
    $('tr').live('click', function() {
        var obj = $('<div/>');
        obj.load('<?php echo base_url();?>index.php/a/b/1', function() {
            obj.dialog({
                close: function(event, ui) {
                    $(this).dialog("destroy")
                }
            })
        })
    })
})
于 2011-07-22T04:59:29.123 回答