2016-12-03 3 views
1

私のウェブページは、ユーザによってアップロードされ、サーバによって処理されて戻された多くのデータを処理します。場合によっては、ユーザーがデータの一部をフィルタリングして、サーバーがそのデータのサブセットのみを処理するようにしたい場合があります。だから私のウェブページには、クライアントの状態に応じてフィルタリングする素敵な「フィルタ」ボタンがあります。どのようにして、中間クリックでjavascriptリンクを開くことができますか?

短いストーリー:私のクライアントは、そのボタンをミドルクリックして新しいタブで開くようにしたいと考えています。 (実際には右クリック - > '新しいタブで開く'を使用するので、これもサポートする必要があります)

私はletting the user deciding how to open their linksを信じていますので、このフィルタボタンを開いて新しいウィンドウが自動的に表示されます。しかし、私は最初にJSフィルタを実行する必要があるので、[a href]リンクにすることはできません。

質問が表示されるようになるには、開く前にコードを実行するリンクを作成するにはどうすればよいですか?

EDIT:マウスクリックイベントを使用するソリューションは、右クリック+新しいタブで開いているユーザーにとっては失敗します。これはユーザー間でかなり一般的です。私はそれに応じて質問を更新しました。

+0

try mousedown ... – YOU

+0

@YOU' mousedown'トリガーはできませんユーザーはドラッグして実際にはクリックしませんか?ユーザーがクリックしても早く消えない? – qxz

答えて

0

:私は、私は必要なすべてのフィルタリングされたデータを保持しましたブラウザのローカルストレージ。ユーザーがリンクを開いたときに、ローカルストレージを見て、保存されたデータのロジックを実行したページにリダイレクトされ、再び適切な場所にリダイレクトされました。

これは理想的ではありません。ユーザーがリンクを直接hrefからコピーして共有しようとすると、別のユーザーのコンピュータでは動作しません(このような場合は警告を表示できます)。 しかし、ユーザーがリンクをクリックして新しい開かれたリンクを共有すると、それが機能するので、私はこのソリューションに「十分に良い」というラベルをつけています。

0

単純なonclickを使用してから、JavaScriptでevent.buttonを使用して、どのマウスボタンがクリックされたかを確認できます。これは、マウスボタンを表す整数値を返します。 0は標準(通常は左)クリック、中央のマウスボタンは1(必要なもの)、右ボタンは2です。これにより、ポインティングデバイスの再構成も可能になるため、物理的な中央ボタンマウスが使用されたときにトリガーされるのではなく、マウスの中央ボタンとして機能するように設定されたキーを使用します。

あなたはevent.button

https://developer.mozilla.org/En/DOM/Event.buttonのEDITの詳細を読むことができます:それは例えば(新しいタブでリンクを開くしないようにそれは、同様に、おそらく event.preventDefault()方法を使用して価値がある

)。ただし、これを使用する場合は手動でリンクを開く必要があります。

+0

しかし、これは右クリックして '新しいタブで開く'を選択したユーザーにとっては失敗します... – Gilthans

+0

@Gilthans私は、イベントの後に 'event.preventDefault()'が実行されるように設定すると思っています.button' check( 'if'ステートメントの内側にあるので) –

0

ボタンを使用して、フィルタロジックを配置して新しいタブを開くことができるクリックイベントをキャプチャします。いつでもcssを使用してボタンやリンクスタイルのように見えるようにすることができます。

thisは、マウスのクリックを使用する方法がわかります。

0

あなたはこれを試すことができます。

$("button").on('mousedown', function(e) { 
if(e.which == 1) { 
    //Left button clicked 
}else if(e.which == 2) { 
    //Middle button clicked 
} else if(e.which == 3) { 
    //Right button clicked 
} 
}); 
0

あなたはjavascriptを使用して、次のアイデアを使用することができます。

HTML:

<a href="javascript:void(0);" onclick="clickMe();">Click Me</a> 

Javascriptを:

function clickMe() { 

    //Do here whatsever you want 
    var test = "test"; 
    alert(test); 

    var link = "mylink/whatsever-query-string"; 

    /// Use this if you want open link in self window 
    // window.location.href = "mylink/whatsever-query-string"; 

    /// Use this if you want open link in new window 
    window.open(link, "", 'width=500, height=600, toolbar=no,location=no, resizable=yes,scrollbars=yes, directories=no,status=no, titlebar=no'); 

    /// Use this if you want open link in new tab 
    // window.open(link, '_blank'); 
} 

DEMO Fiddle

EDIT:中央のマウスクリックのためには、以下のようなものを使用することができます

HTML

<div onmousedown="WhichButton(event)">ClickMouse</div> 

JAVASCRIPT:ここを通過し、誰のために、私は解決策を見つけた

function WhichButton(event) { 
    var x = event.buttons; 
    if (x == 4) { 
    var test = "test"; 
    alert(test); 
    window.open('', '_blank'); 
    } 
} 

DEMO

関連する問題