26

ご存知のように、TABキーボードのキーをクリックすると、開いている Web ページにあるすべてのアクティブな href リンクをナビゲートできます。これらの URL を JavaScript で読み取ることはできますか?

例：

function checkTabPress(key_val) {
    if (event.keyCode == 9) {
        // Here read the active selected link.
    }
}
4

8 に答える 8

15

これは、keyup イベントで実行できるはずです。具体的にevent.targetは、選択した要素を指す必要がevent.target.hrefあり、その要素の href-value を提供します。詳細については、 mdnを参照してください。

次のコードは jQuery ですが、定型コード以外は純粋な JavaScript で同じです。これは、keyupすべてのリンク タグにバインドされるハンドラーです。

$('a').on( 'keyup', function( e ) {
    if( e.which == 9 ) {
        console.log( e.target.href );
    }
} );

jsFiddle: http://jsfiddle.net/4PqUF/

于 2013-08-19T14:51:52.910 に答える
12

次のhtmlを持つ：

<!-- note that not all browsers focus on links when Tab is pressed -->
<a href="http://example.com">Link</a>

<input type="text" placeholder="Some input" />
<a href="http://example.com">Another Link</a>

<textarea>...</textarea>

次の方法でアクティブなリンクにアクセスできます。

// event listener for keyup
function checkTabPress(e) {
    "use strict";
    // pick passed event or global event object if passed one is empty
    e = e || event;
    var activeElement;
    if (e.keyCode == 9) {
        // Here read the active selected link.
        activeElement = document.activeElement;
        // If HTML element is an anchor <a>
        if (activeElement.tagName.toLowerCase() == 'a')
            // get it's hyperlink
            alert(activeElement.href);
    }
}

var body = document.querySelector('body');
body.addEventListener('keyup', checkTabPress);

これが実際の例です。

于 2013-08-19T14:46:40.730 に答える
1

次の HTML コードが与えられた場合:

<a href='https://facebook.com/'>Facebook</a>
<a href='https://google.ca/'>Google</a>
<input type='text' placeholder='an input box'>

この JavaScript を使用できます。

function checkTabPress(e) {
    'use strict';
    var ele = document.activeElement;

    if (e.keyCode === 9 && ele.nodeName.toLowerCase() === 'a') {
        console.log(ele.href);
    }
}

document.addEventListener('keyup', function (e) {
    checkTabPress(e);
}, false);

イベントリスナーをイベントのdocument要素にバインドしました。これにより、キーが押された (または技術的には離された) かkeyUpどうかを確認する関数がトリガーされます。Tab

この関数は、現在フォーカスされている要素と、 が であるかどうかNodeNameをチェックしますa。ifその場合、ブロックに入り、私の場合は、hrefプロパティの値を JavaScript コンソールに書き込みます。

ここにjsFiddleがあります

于 2013-08-19T14:50:19.937 に答える
-8

ウェブサイトの URL には正規表現を使用する必要があります。

var urlPattern = /(http|ftp|https)://[\w-]+(.[\w-]+)+([\w.,@?^=%&:/~+#-]* [\w@?^=%&/~+#-])?/

例のようにこの式を使用します

var regex = new RegExp(urlPattern ); var t = 'www.google.com';
var res = t.match(regex /g);

Webページを変数tのこのjavascriptに文字列として渡し、配列を取得する必要があります

于 2014-07-12T05:38:57.113 に答える