在jQuery模态窗口加载外部php文件的onclick(Load external php fil

2019-06-27 01:23发布

我想,当用户点击一个链接,打开一个jQuery模式对话框。 我想这样一个外部的PHP文件加载到对话框。 我使用这个jQuery:

$(document).ready(function() { 
     $('#register').dialog({
         title: 'Register for LifeStor',
         resizable: true,
         autoOpen:false,
         modal: true,
         hide: 'fade',
         width:350,
         height:275,
      });//end dialog   
      $('#reg_link').click (function() {
          open: (function(e) {
             $('#register').load ('register.php');
        });
      }); 
    }); 

而这个HTML:

<div id="register"></div>

它被设置为显示:无在.css文件。

另外上,一个形式里面,链路称为:

<td><font size="2">Not registered? <a href="#" name="reg_link">Sign-Up!</a></td>

(我会改变表的div)。

我不同意这个代码得到任何错误,但是当我点击链接没有任何反应。 我最上面的其他堆栈溢出的职位。 我缺少的东西吗? 是表HTML干扰?

问候...

Answer 1:

在您的链接

<a href="#" name="reg_link">Sign-Up!</a>

name="reg_link" ,应该是id="reg_link"来代替,即

<a href="#" id="reg_link">Sign-Up!</a>

因此,它会与下面的代码工作

$('#reg_link').click(function(e) {
    e.preventDefault();
    $('#register').load('register.php');
});

为了让一个对话框,您可以使用

$(document).ready(function() { 

     var dlg=$('#register').dialog({
        title: 'Register for LifeStor',
        resizable: true,
        autoOpen:false,
        modal: true,
        hide: 'fade',
        width:350,
        height:275
     });


     $('#reg_link').click(function(e) {
         e.preventDefault();
         dlg.load('register.php', function(){
             dlg.dialog('open');
         });
      }); 
});

只是一个例子



Answer 2:

创建对话框加载页面后, .load()用新的内容替换容器的内容

您单击处理程序有语法错误,它看起来像你的传递函数的组合和对象作为参数,它应该是一个正常功能。 喜欢

$('selector').click (function() {
     //code
});

此外,您的<a>元素已reg_link的名称不标识

$(document).ready(function() { 
    $('#reg_link').click (function() {
        $('#register').load ('register.php', function(){
            $('#register').dialog({
                title: 'Register for LifeStor',
                resizable: true,
                modal: true,
                hide: 'fade',
                width:350,
                height:275,
            });//end dialog   
        });
    });
});

<td><font size="2">Not registered? <a href="#" name="reg_link" id="reg_link">Sign-Up!</a></td>


Answer 3:

我并不完全熟悉.dialog()函数,但你使用.click()是错误的。 部分的问题是关于大括号有些混乱{} 他们使用两个完全独立的东西,你在这里混了两间。

在第一次使用大括号的是,以指示一个块的内部:一个环的内侧,一个条件的内部,一个函数的内部。 例如:

// some code in the global scope
function something()
{
    // some different code within this function block
}
// function's done, we're back in global scope

第二使用是对象或关联数组,其中属性或值与在下面的格式名称或键成对的JSON(JavaScript对象符号):

var jsonSomething = {
    key1: value1,
    key2: value2,
    etc: etcvalue,
};

当你写$('#reg_link').click (function() { ,你打开了一个功能块与大括号,而不是开始JSON因此,当你写, open: (仿佛这一个JSON和你设置的open关键),什么是绝对行不通的,你期望它的方式(我很惊讶......那种......,有没有错误,其实)。你需要什么内写这些大括号是一个函数的代码在这种情况下,它可能只是这样:

$('#reg_link').click (function() {
    $('#register').load ('register.php');
});

在一般情况下,jQuery的这两个版本使用了很多 ,而且经常混合在一起他们(接受JSONs作为参数,或JSONs包括函数回调为项功能),可以这么理解是,它真的很重要。

编辑:一些谷歌搜索重: .dialog()表明您还需要后调用它.load()这意味着该块应该是这个样子:

$('#reg_link').click (function() {
    $('#register').load ('register.php').dialog(/*argument(s) here*/);
});

根据你自己的代码, .dialog()实际上是需要一个JSON作为参数,所以假设位的正确,完整的代码是这样的函数的例子:

$('#reg_link').click (function() {
    $('#register').load ('register.php').dialog({
        title: 'Register for LifeStor',
        resizable: true,
        autoOpen: false,
        modal: true,
        hide: 'fade',
        width:350,
        height:275,
    });
});


文章来源: Load external php file in jquery modal dialog onclick