जावास्क्रिप्ट/jQuery

के माध्यम से आईई में तीर कुंजी प्रेस का पता लगाने मैं एक मेनू स्थापित करने की कोशिश कर रहा हूं जिसे तीर कुंजियों के माध्यम से नेविगेट किया जा सकता है। मेरे पास फ़ायरफ़ॉक्स में यह कामकाजी फिन है।जावास्क्रिप्ट/jQuery

आईई 8 में काम करने की कोशिश करने और कुछ संघर्ष के बाद, यह पाया गया कि ऐसा इसलिए था क्योंकि आईई 8 तीर पर एक कीप्रेस पंजीकृत नहीं करेगा। परीक्षण करने के लिए:

$(document).keypress(function (eh){ 
    alert(eh.keyCode); 
};

Firefox में, तीर कुंजी के किसी भी दबाने, कुछ भी नहीं 37, 38, 39 या 40

की एक चेतावनी IE8 में ट्रिगर करेगा। मानक QWERTY कीबोर्ड पर कोई अन्य कुंजी पंजीकृत होगी, लेकिन तीर कुंजी नहीं।

क्या यह मेरे जावास्क्रिप्ट के साथ कोई समस्या है? एक ब्राउज़र सेटिंग? एक विंडोज़ सेटिंग?

स्रोत

2010-02-07 DA.

कृपया यह जांचना न भूलें कि कोई उपयोगकर्ता Alt-key दबाता है या नहीं। और का उपयोग करके पीछे और पीछे ब्राउज़ करने के लिए डिफ़ॉल्ट व्यवहार को रोकने के दौरान नेविगेशन के लिए और का उपयोग करते समय यह वास्तव में बुरा व्यवहार है। –

@ मार्सल alt-arrow नेविगेशन क्या करता है? मैंने इसका कभी भी उपयोग नहीं किया है और न ही मैं उन ब्राउज़रों में कुछ भी कर रहा हूं जो मैं उपयोग कर रहा हूं। –

कम से कम फ़ायरफ़ॉक्स, क्रोम और आईई (केवल एक त्वरित परीक्षण) बैक बटन दबाकर समान है, आगे बटन दबाकर है (मैं अक्सर इन हॉटकी का उपयोग करता हूं)। –

jQuery keypress documentation (परिचयात्मक पाठ की अंतिम पैराग्राफ) से

ध्यान दें कि keydown और keyup, keypress इंगित करता है जो चरित्र दर्ज किया गया था एक कोड का संकेत है जो कुंजी दबाने प्रदान करते हैं। उदाहरण के लिए, लोअरकेस "ए" को keydown और keyup द्वारा 65 के रूप में रिपोर्ट किया जाएगा, लेकिन 97 के रूप में keypress। सभी घटनाओं द्वारा एक अपरकेस "ए" को 97 के रूप में रिपोर्ट किया जाता है। इस भेद के कारण, विशेष कुंजीस्ट्रोक जैसे तीर कुंजियों को पकड़ते समय, .keydown() या .keyup() बेहतर विकल्प है।

यह भी सचमुच तीर कुंजी के बारे में उल्लेख है;) इस प्रकार, आप वास्तव में या तो keydown या keyup घटनाओं पर हुक करने की जरूरत है। यहां keydown के साथ है, बस कॉपी करें 'इसे' कॉपी न करें। नहीं, आपको event पर ब्राउज़र-संगत चेक करने की आवश्यकता नहीं है, यह आईई 6 से सभी फ़ायरफ़ॉक्स में फ़ायरफ़ॉक्स के साथ काम करता है।

<!doctype html> 
<html lang="en"> 
    <head> 
     <title>SO question 2217553</title> 
     <script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script> 
     <script> 
      $(document).keydown(function(event) { 
       switch (event.keyCode) { 
        case 37: alert('left'); break; 
        case 38: alert('up'); break; 
        case 39: alert('right'); break; 
        case 40: alert('down'); break; 
       } 
      }); 
     </script> 
    </head> 
    <body> 
     <p>Press one of the arrow keys.</p> 
    </body> 
</html>

स्रोत

2010-02-08 00:04:52 BalusC

+1। आरटीएफएमिंग के लिए मेरे लिए -1। ; ओ) –

आपका स्वागत है। – BalusC

इस समस्या वाले भविष्य के लोगों के लिए, ध्यान दें कि आपको '$ (दस्तावेज़)' के लिए 'कीडाउन' ईवेंट' का उपयोग करना चाहिए, न कि '$ (विंडो) '(यह एक समस्या थी जिसमें मैंने भाग लिया था)। –

'keydown' घटना

स्रोत

2010-02-07 17:34:35 psychotik

का उपयोग करें इसे आज़माएं:

$(document).keydown(function (e) { 
    if(!e) { 
     e = window.event; 
    } 
    switch(e.keyCode) { 
    case 37: 
     goLeft(); 
     break; 
    case 39: 
     goRight(); 
     break; 
    } 
});

स्रोत

2010-02-07 17:39:02 Skilldrick

jQuery के साथ आवश्यक 'window.event' की जांच है? मुझे समझ में आया कि इसे करने की आवश्यकता को हटा दिया गया है। आपके लिए एक संपूर्ण उत्तर देने के लिए –

क्योंकि मैं कभी कभी कुछ चाबी के लिए बुलबुला करने के लिए घटनाओं नहीं करना चाहते, मैं की तरह कुछ का उपयोग करें: आप के रूप में अनुकूलित कोड/कुंजी उचित समझना।

/* handle special key press */ 
function checkCptKey(e) 
{ 
    var shouldBubble = true; 
    switch (e.keyCode) 
    { 
     // user pressed the Tab                                   
     case 9: 
      { 
       $(".someSelect").toggleClass("classSelectVisible"); 
       shouldBubble = false; 
       break; 
      }; 
      // user pressed the Enter  
     case 13: 
      { 
       $(".someSelect").toggleClass("classSelectVisible"); 
       break; 
      }; 
      // user pressed the ESC 
     case 27: 
      { 
       $(".someSelect").toggleClass("classSelectVisible"); 
       break; 
      }; 
    }; 
    /* this propogates the jQuery event if true */ 
    return shouldBubble; 
}; 

/* user pressed special keys while in Selector */ 
$(".mySelect").keydown(function(e) 
{ 
    return checkCptKey(e); 
});

स्रोत

2010-02-07 23:50:19

उत्तर

संबंधित मुद्दे