2012-03-05 13 views
8

私はAJAX指向のサイトを構築することだし、すべての私のリンクは次のように動作します:新しいタブでこれらのリンクは、オープンにする方法オープンAjaxのリンク

<div class="link">press me </div> 

<div id="contents" ></div> 
<script> 
    $('div[class="link"]').click(function() { 
     $.ajax({          
      url: 'contents/get_products.php', 
      type: "GET",   
      data: 
      dataType: 'json',    
      success: 
       function(data){ 
        $.each(data, function(i){ 
         $('#contents').append('<div class="cat_list_item">something</div>'); 
        }); 
      } 
     }); 
    }); 
</script> 

(ミドルクリックonまたは「オープンリンクについて右クリックで「新しいタブで」)。

私は、ブラウザがAjax呼び出しから取得したデータなしで元のページ(URL)を開くだけであることを知っていますが、新しいタブにデータをロードする方法を教えてください。 私はインターネットを見てきましたが、今は解決策が見つかりませんでした。

答えて

3

いいえ、少なくともあなたのアプローチを使用することはほとんどできません。ブラウザでネイティブに提供される新しいタブ機能を使用する場合は、divを使用してリンクにJavascriptハンドラをアタッチすることはできません。

あなたができること:window.open_blankを使用しますが、あなたはポップアップブロッカーに問題があります。これはおそらくあなたが望むものではありません。

<a class="link" href="my-ajax-view/?some=parameters">press me</a>を使用して、探しているコンテンツを表示するページを作成することもできます(JavaScriptをオフにしているユーザーの5%の機能を提供するため、 。そのリンクをクリックするだけで、まだAJAXの読み込みをJQueryで行うことはできますが、誰かが新しいタブでリンクを開くと、情報を収集するページにリダイレクトされます。新しいクリックハンドラは次のようになります。

$('a.link').click(function(event) { 
    event.preventDefault(); 
    // Your ajax request here 
} 
1

あなたは常に動的にPHPコードをHTMLページを作成し、ターゲット、それにして述べたようにアドレスを返すことができます=「_ブランク」それをwindow.openコマンドのJavaScriptから。

また、jQuery UIを使用して結果データを含む新しいタブを作成すると、ジョブが実行されますか?

3

これはAJAXのコンセプトに反しています.AJAXは個々のデータの要求を送信することでその結果を取り除き、現在のページを更新します。このコンセプトの外にブレークがある新しいタブを作成するようにデータを要求する場合、これを行うには、実際にタブを表示するようにもう一度要求する必要があります。

のどちらかに選択します。

  1. データは、AJAXを使用して現在のタブに表示されるように、...

  2. OR

    は全くAJAXを行うことなく、ちょうどその要求新しいタブを開きますデータ。

全く意味をなさないため、これら2つを混用しないでください。

1

私は同じ問題で苦労していました。私は非常に簡単な解決策を見つけました。それだけで基本的にこのような単純な条件でAJAXコードをチェックしています:

if (event.which !== 2) { 
    // ajax code 
} 

あなたはそれはまだ通常のリンクのように動作いない場合は、マウスの中央ボタンをクリックしない場合にのみ、AJAXを呼び出し、それだ。この道を新しいタブでページを開きます。

関連する問題