javascriptのポップアップウィンドウをjqueryダイアログに置き換えます。

Question

webtreesのカスタムテーマを作成しています。 Webtreeは多くのポップアップウィンドウを使用しており、jqueryダイアログでそれらを置き換えたいですが、コアコードを混乱させたくありません。したがって、jqueryスクリプトは元の関数とonclickイベントをオーバーライドする必要があります。私はインターネット上で検索しましたが、解決策は見つかりませんでした。あなたの一部が私を助けてくれることを願っています。

これは私がオーバーライドしたい機能の一つである：

<a class="help" onclick="helpPopup('index_charts','charts'); return false;" href="#"> 

私はjQueryのダイアログのためのいくつかのjqueryのソリューションを試みたが、それらのどれも働いた：

var helpWin; 
function helpPopup(which, mod) { 
    if (which==null) which = "help_contents_help"; 
    if (mod!='') which=which+'&mod='+mod; 
    if ((!helpWin)||(helpWin.closed)) { 
     helpWin = window.open('help_text.php?help='+which,'_blank','left=50,top=50,width=500,height=320,resizable=1,scrollbars=1'); 
    } else { 
     helpWin.location = 'help_text.php?help='+which; 
    } 
    return false; 
} 
function closeHelp() { 
    if (helpWin) helpWin.close(); 
} 

HTMLは次のようになります。

あなたが戻って取得コンテンツを表示するダイアログをplumbする、その後、$アヤックスの呼び出しでwindow.open呼び出しを置き換えることができるはずです http://jsfiddle.net/sottenad/b2JY9/

：

Answer 1

はこのような何かを試してみてください。ダイアログを開くか、既に開いている場合は、既存のコンテンツを置き換えてください。

注：フィドルは実行されませんが、そのコードを読みやすくなります。

Answer 2

最初はjqueryのエキスパートではないので、もっとうまくいくかもしれませんが、元のonclickイベントからダイアログボックスを取得することができました。

$('a.help').livequery(function(){ 
     var cl = $(this).attr('onclick'); 
     var str = cl.split("('").pop().split("')").shift(); 
     var arr = str.split("','");  
     if (arr[1] == '') { 
      qvar = arr[0]; 
     } 
     else { 
      qvar = arr[0]+'&mod='+arr[1]; 
     }  
     $(this).removeAttr('onclick'); 
     $(this).attr('href', 'help_text.php?help='+qvar); 

     var $link = $(this);   
     var $dialog = $('<div id="help-dialog"></div>') 
      .load($link.attr('href')) 
      .dialog({ 
       autoOpen: false,     
       width: 500, 
       modal: true   
      }); 

     $link.click(function() { 
      var htitle = $dialog.find('.helpheader'); 
      htitle.hide(); 
      $dialog.dialog('option', 'title', htitle.text()); 
      $dialog.find('.helpfooter').remove(); 
      $dialog.dialog('open'); 
      return false; 
     }); 
    }); 

最初に私はonclick値からリンクを作成してhref属性に入れました。そうすれば、hrefリンクのページの内容をダイアログに表示できます。

私が働くことができなかったことが1つあります。ダイアログコンテンツ内にはフッターに2つのリンクがあります。当分の間、私はフッタの内容を削除しましたが、それは私が最終的に望むものではありません。

1つのリンクは近いリンクです。私はそれがこのコードで作業を取得しようとした：それは働いているが、それはまた、メインページを更新し、私はなしので、それはダイアログのtopright隅にデフォルトclosebuttonと同じように動作するようにしたい

$dialog.find('.helpfooter a[onclick*="close"]'); 
closelink.removeAttr('onclick'); 
closelink.click(function() { 
    $dialog.dialog('close'); 
}); 

ページをリフレッシュします。どうやってやるの？

フッターの2番目のリンクは、別の（一般）ページへのリンクです。このリンクをクリックすると、現在のダイアログボックスを閉じて、新しいページの内容を含む新しいダイアログボックスを開きます。それは可能ですか？もしそうなら、私はどのようにそれを行うことができます。