टैब कुंजी प्रेस

Question

को संभालने के लिए जावास्क्रिप्ट जैसा कि हम जानते हैं, जब हम कीबोर्ड पर टैब कुंजी पर क्लिक करते हैं, तो यह हमें खुले वेबपृष्ठ मौजूद सभी सक्रिय href लिंक के माध्यम से नेविगेट करने की अनुमति देता है। जावास्क्रिप्ट के माध्यम से उन यूआरएल को पढ़ना संभव है?

उदाहरण:

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

Answer 1

होने निम्नलिखित एचटीएमएल:

<!-- 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); 

यहाँ working example है।

Answer 2

एचटीएमएल कोड के इस टुकड़े को देखते हुए:

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); 

मैं keyUp घटना के लिए document तत्व को एक event listener बाध्य है, जो करने के लिए एक समारोह से चलाता है:

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

हम इस जावास्क्रिप्ट का उपयोग कर सकते जांचें कि टैब कुंजी दबाया गया था (या तकनीकी रूप से, जारी)।

फ़ंक्शन currently focused element की जांच करता है और क्या NodeNamea है। यदि ऐसा है, तो यह if ब्लॉक में प्रवेश करता है और, मेरे मामले में, href संपत्ति का मूल्य जावास्क्रिप्ट कंसोल में लिखता है।

यहाँ एक jsFiddle

Answer 3

आप KeyUp घटना के साथ ऐसा करने में सक्षम होना चाहिए है। विशिष्ट होने के लिए, event.target चयनित तत्व पर इंगित करना चाहिए और event.target.href आपको उस तत्व का href-value देगा। अधिक जानकारी के लिए mdn देखें।

निम्नलिखित कोड jQuery है, लेकिन बॉयलरप्लेट कोड के अलावा, शेष शुद्ध जावास्क्रिप्ट में समान है। यह keyup हैंडलर है जो प्रत्येक लिंक टैग से जुड़ा हुआ है। // [\ w:

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

jsFiddle: (| | एफ़टीपी https http) http://jsfiddle.net/4PqUF/

Answer 4

आप वेबसाइट यूआरएल के लिए नियमित अभिव्यक्ति उपयोग करने के लिए यह

वर URLPATTERN = /है जरूरत -] + (। [\ w -] +) + ([\ w।, @?^=% &:/~ + # -] * [\ w @?^=% &/~ + # -])?/

उदाहरण के रूप में इस अभिव्यक्ति का उपयोग करें

var regex = new RegExp (urlPattern); var t = 'www.google.com';
var res = t।मैच (रेगेक्स/जी);

आप KeyCodes.TAB उपयोग कर सकते हैं आप चर टी में इस जावास्क्रिप्ट को सरणी

Answer 5

केवल एक 9 के बजाय सुझाव स्ट्रिंग के रूप में अपने वेब पेज गुजरती हैं और प्राप्त करने के लिए के लिए।