jqueryモーダルダイアログで外部PHPファイルをロードするon click

Question

ユーザーがリンクをクリックしたときにjqueryモーダルダイアログボックスを開こうとしています。私はその後、ダイアログボックスに外部のPHPファイルをロードしたいと思います。

$(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：：私はこのjqueryのを使用してい

表示に設定されている

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

：.cssファイルでなし。

はさらに上、フォーム内、リンクが呼び出されます。

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

（私はdiv要素にテーブルを変更することがあります）。

このコードではエラーは発生しませんが、リンクをクリックしても何も起こりません。私は他のスタックオーバーフローポストから上記のほとんどを得ました。何か不足していますか？テーブルのHTMLは干渉していますか？ページ.load()をロードした後

よろしく...

Answer 1

あなたが id="reg_link"代わりに、すなわち

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

だから、それはそれあなたが

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

を使用することができますダイアログようにするには、次のコード

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

でうまくいくべきであるname="reg_link"を持っ

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

Just an example。

Answer 2

は、ダイアログを作成しますあなたのクリックハンドラは、構文エラーがあり、それはあなたがの組み合わせを渡すように見える

新しいコンテンツとコンテナの内容を置き換えます関数とオブジェクトを引数とする場合、通常の関数でなければなりません。

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

はまた、あなたの<a>要素は名前ではないID

$(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

としてreg_linkを持っているように私は.dialog()機能に完全に慣れていないんだけど、あなたは.click()が間違って使っています。問題の一部は、中括弧{}に関する混乱です。それらは2つの完全に別々のものに使用されています。

中括弧の最初の使用は、ブロックの内部を示すことです：ループの内部、条件の内部、関数の内部。例えば：

// 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それらを一緒にミックスエントリー）、どちらがどちらであるかを理解することは本当に重要です。

EDIT：いくつかのグーグル再：.dialog()ブロックは次のようになりますことを意味し、あなたも​​後にそれを呼び出す必要がありますことを示唆している：

$('#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, 
    }); 
});