2012-04-25 2 views
1

ctrlキーを使用して複数のリンクのクリックを処理する方法(方法がある場合)を知りたいと思います。Ctrlキーで複数ページハイパーリンクをクリックする方法

たとえば、ユーザーは約3つのハイパーリンクを持つWebページにアクセスします。その後、ユーザはctrlキーを押したまま、あるリンクをクリックして別のリンクをクリックします。次にctrlキーがリリースされると、イベントが発生します(ハイパーリンクの値の組み合わせに基づく検索)。

私はC#を使用しており、おそらく解決策はjQueryで行われると仮定しますか?

選択は、Windowsエクスプローラと同様に機能するはずです。 ctrlのキーを押したままファイルを選択し、別のファイルを選択してから、別の場所にコピーして貼り付けます。

私は他の場所で助けを見つけるのに苦労しているので、あなたが提供できる助けを感謝します。

+0

あなたはこれまで何を試してみました?単純な方法で 'class =" selectedItem "'を選択したハイパーリンク..に設定します。 –

+0

クライアントブラウザに、使用しているキー(Ctrlなど)のカスタムバインディングがある場合、引き続きデフォルトのブラウザ動作が発生することに注意してください。 –

答えて

0

ハイレベルのアイデアは

1になります)この関数はクラスを切り替える必要があり、ハイパーリンクのKeyDownイベントjavsacriptイベントのCtrlキーを検出するjavascript関数を書く)、選択されたリンク

2を強調表示するCSSクラスを作成します。選択されたリンクへのハイパーリンク(ユーザーがどのハイパーリンクが選択されているかを知るため)ハイパーリンクの値/ URLを非表示フィールドに追加して、選択されたハイパーリンクのリンクを知る

3)ハイパーリンクのKeyUp javacriptイベントにjavascript関数を書く選択されたリンクを作成し、それに対するアクションを実行します。

+0

ありがとうございます。私はこれを私のソリューションに取り入れます – Marky

1

このようなことができます。 Ctrlキー(キーコード= 17)の状態を保持し、CTRLが押されたとき(キーダウンイベント)、キーアップイベント(キーコード== 17のとき)で新しいウィンドウでリンクを開く。タブでそれらを開くことは実際にはできませんが、Firefox用のサンプルがあります。 thisを読んでください。

例:

<html> 
<head> 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script> 

<script type="text/javascript"> 
var ctrlIsDown = false; 
var links = new Array(); 

function afterKeyUp() 
{ 
    if(links.length > 0){ 
     for(var link in links){ 
       window.open(links[link]); 
     } 
     links = new Array(); 
     $("a").css('color', ''); 
    } 
} 

$(document).ready(function(){ 

$(document).keydown(function(e){ 
    if(e.which == 17) { 
     ctrlIsDown = true; 
    } 
}); 

$(document).keyup(function(e){ 
    if(e.which == 17) { 
     ctrlIsDown = false; 
     afterKeyUp(); 
    } 
}); 

$("a").click(function(e){ 
    if(ctrlIsDown){ 
     var href = $(this).attr("href"); 
     if($.inArray(href, links) == -1) 
     { 
      links[links.length] = href; 
      $(this).css('color', 'red'); 
     } 
    e.preventDefault(); 
    } 
}); 

}); 
</script> 
</head> 
<body> 

<a href="1.html">Link 1</a> 
<a href="2.html">Link 2</a> 
<a href="3.html">Link 3</a> 


</body> 
</html> 
+0

ブライアンに感謝します。私はこれを間違いなく試みます。 – Marky

関連する問題