JQuery এর সাথে পালানোর কীটির জন্য কী কী কোড


559

আমার দুটি কাজ আছে। এন্টার টিপে গেলে ফাংশনগুলি সঠিকভাবে চলতে থাকে তবে যখন এস্কেপ চাপলে এটি হয় না। পালানোর কীটির সঠিক সংখ্যাটি কী?

$(document).keypress(function(e) { 
    if (e.which == 13) $('.save').click();   // enter (works as expected)
    if (e.which == 27) $('.cancel').click(); // esc   (does not work)
});

কিপ্রেস একটি কী-এর সাথে সংযুক্ত একটি অক্ষর ফিরিয়ে দেবে (সঠিক ক্যাপস ইত্যাদিতে), কীআপটি চাপানো হার্ডওয়্যার বোতামের সংখ্যাটি ফিরিয়ে দেবে। ইসি-র জন্য আপনি হার্ডওয়ার কোড 27 চান (আসকি অক্ষর 27 নয়)
জোয়ারি


আপনি যে কোন কোড কোডটি চান তা খুঁজে পাওয়ার জন্য খুব সহজ কৌশল আছে। document.addEventListener("keydown", e => console.log(e.keyCode))আপনার ব্রাউজার কনসোলে রাখা একটি নতুন ট্যাব খুলুন, উইন্ডোটিতে ক্লিক করুন এবং আপনি যে কীটি সন্ধান করছেন তা টিপুন।
anarchist912

উত্তর:


925

দিয়ে চেষ্টা keyup ইভেন্ট :

$(document).keyup(function(e) {
  if (e.keyCode === 13) $('.save').click();     // enter
  if (e.keyCode === 27) $('.cancel').click();   // esc
});

39
কীপ্রেস বনাম কীপ্রেসের সাথে এটির কোনও সম্পর্ক নেই। ESCAPE ক্যাপচার করতে আপনার e.keyCode এর বিপরীতে e.keyCode দেখতে হবে (যা এই উদাহরণটি ঘটবে)।
ডিকেমিনস

211
"কীপ্রেম বনাম কীপ্রেসের সাথে এটির কোনও সম্পর্ক নেই" - এটি ভুল, ডিকেমিন। কিপ্রেস ব্রাউজারগুলির মধ্যে অবিচ্ছিন্নভাবে পরিচালিত হয় বলে মনে হয় না ( ফায়ারফক্স বনাম Chrome বনাম api.jquery.com/keypress এ ডেমো চেষ্টা করে দেখুন - কখনও কখনও এটি নিবন্ধ হয় না এবং 'যা' এবং 'কীকোড' উভয়ই পৃথক হয়) যদিও কীআপ সামঞ্জস্যপূর্ণ। e. যা jquery- নরমালাইজড মান, তাই 'যা' বা 'কী কোড' উভয়ই কী-আপে কাজ করা উচিত।
জর্দান বুউ

13
@ জর্দান বুরো - আমি আপনাকে আপনার মন্তব্যটি উত্তর হিসাবে পোস্ট করার জন্য অনুরোধ করতে চাই যাতে লোকেরা এটি পড়ে এবং আপনার মন্তব্যের আসল অর্থ বুঝতে পারে! যেহেতু আপনার মন্তব্য উত্তরটি উত্তর হিসাবে গুরুত্বপূর্ণ ততই গুরুত্বপূর্ণ
মুর্তজা

15
keydownনেটিভ আচরণের নকল করবে - উইন্ডোজে কমপক্ষে ESC টিপুন বা একটি কথোপকথনে ফিরে আসা কীটি প্রকাশের আগে ক্রিয়াকে ট্রিগার করবে।
থমথম

2
@ গিবার্বিশ আমি এখানে একটি উত্তর হিসাবে আমার মন্তব্য যুক্ত করেছি: stackoverflow.com/a/28502629/58876
জর্দান বারো

77

আপনার ফাংশনের কীকোড মানগুলিকে হার্ডকোড করার পরিবর্তে, আপনার অর্থটি আরও ভালভাবে জানাতে নামযুক্ত ধ্রুবকগুলি ব্যবহার করার বিষয়টি বিবেচনা করুন:

var KEYCODE_ENTER = 13;
var KEYCODE_ESC = 27;

$(document).keyup(function(e) {
  if (e.keyCode == KEYCODE_ENTER) $('.save').click();
  if (e.keyCode == KEYCODE_ESC) $('.cancel').click();
});

কিছু ব্রাউজার (যেমন ফায়ারফক্স, অন্যদের সম্পর্কে অনিশ্চিত) একটি গ্লোবাল KeyEventঅবজেক্টকে সংজ্ঞায়িত করে যা আপনার জন্য এই ধরণের ধ্রুবককে প্রকাশ করে। এই তাই প্রশ্নটি অন্যান্য ব্রাউজারগুলিতে সেই বস্তুটিকে সংজ্ঞায়িত করার একটি দুর্দান্ত উপায় দেখায়।


15
কী, ২ 27 কেবল পালাবার কী হিসাবে আপনাকে ঝাঁপিয়ে পড়ে না?!? সত্যিই, এটি আরও বেশি লোকের দ্বারা করা দরকার। আমি তাদের "ম্যাজিক নম্বর" এবং "যাদু স্ট্রিংস" বলি। 72 এর অর্থ কী? আপনার কোড বেসে আপনার কাছে কেন খুব নির্দিষ্ট এবং অস্থির স্ট্রিংটি অনুলিপি করা হয়েছে? ইত্যাদি
ভবুলিংগার

1
অথবা আপনি কেবল প্রত্যেকটির উপরে একটি মন্তব্য যুক্ত করতে পারেন, কারণ আপনি সম্ভবত একবারে কেবল একবার এগুলি ব্যবহার করছেন। IMO ঠিক পঠনযোগ্য
ইভান ডার্স

8
@ ইভানডার্স্ট আপনি কেবল পদ্ধতি হিসাবে একবার সেগুলি ব্যবহার করতে পারেন তবে আমি আমার প্রকল্পে সেগুলি একাধিকবার ব্যবহার করি। আপনি কি সত্যিই পরামর্শ দিচ্ছেন যে আপনি (1) মানগুলি দেখতে চান এবং (২) আপনি যখনই কোনও মূল কোড ব্যবহার করতে চান তখন সেগুলিতে মন্তব্য করতে চান? আমি আপনার সম্পর্কে জানি না, তবে আমার সেগুলির মুখস্থ করার ইচ্ছা বা অন্য প্রোগ্রামাররা তাদের ধারাবাহিকভাবে মন্তব্য করবে না এমন বিশ্বাসও আমার নেই। এটি কোডিং সহজ এবং আরও সামঞ্জস্যপূর্ণ তৈরি করার বিষয়ে, কেবলমাত্র বেশি পঠনযোগ্য নয়।
শেঠ পেট্রি-জনসন

2
যার অর্থ তারা জানে তাদের মন্তব্য করার অর্থ অনুসন্ধান করতে হবে না এবং একটি মন্তব্য টাইপ করা যেমন দীর্ঘ নাম টাইপ করা ঠিক তত দ্রুত।
নেটমেজ

6
আমরা যখন হেক্সে চরিত্রের ধ্রুবকগুলি কোড ব্যবহার করতাম তখন ভাল পুরানো দিনগুলির যা ঘটেছিল? সবাই জানেন যে ইসি আছে 0x1Bএবং এন্টারটি 0x0Dঠিক আছে?
ডেভিড আর ট্রিবিবল

42

(আমার পূর্ববর্তী মন্তব্য থেকে উত্তরের উত্তর )

keyupপরিবর্তে আপনার ব্যবহার করা উচিত keypress। উদাহরণ:

$(document).keyup(function(e) {
  if (e.which == 13) $('.save').click();     // enter
  if (e.which == 27) $('.cancel').click();   // esc
});

keypressব্রাউজারগুলির মধ্যে অবিচ্ছিন্নভাবে পরিচালিত হয়েছে বলে মনে হয় না ( IE বনাম ক্রোম বনাম ফায়ারফক্সের ডেমোটি দেখুন http://api.jquery.com/keypress । কখনও কখনও keypressনিবন্ধন করে না, এবং 'যা' এবং 'উভয়ের জন্যই মানগুলি হয় না কীকোড 'পরিবর্তিত হয়) যেখানে keyupসামঞ্জস্যপূর্ণ।

যেহেতু e.whichবনাম সম্পর্কে কিছু আলোচনা ছিল e.keyCode: দ্রষ্টব্য এটি e.whichহ'ল জেকারি-নরমালাইজড মান এবং এটি ব্যবহারের জন্য প্রস্তাবিত:

ইভেন্ট.কি সম্পত্তিটি ইভেন্ট.কি কোড এবং ইভেন্ট কোডচোড়কে স্বাভাবিক করে। এটি ইভেন্ট দেখার পরামর্শ দেওয়া হয় keyboard যা কীবোর্ড কী ইনপুটগুলির জন্য।

( http://api.jquery.com/event.Wich/ থেকে )


5
আমি এখানে যুক্ত করতে চাই যে যে ব্রাউজারগুলি keypressপালানোর সময় গুলি চালায় না তারা এটি সঠিকভাবে করছে। keypressযখন চাবি একটি অক্ষর তৈরি করে তখনই গুলি চালানো হয় যেখানে keyupসর্বদা আগুন থাকে। বিকাশকারী.মোজিলা.আর.ইন-
ইউএস

26

যে কোনও কীটির কী-কোডটি সন্ধান করতে, এই সাধারণ ফাংশনটি ব্যবহার করুন:

document.onkeydown = function(evt) {
    console.log(evt.keyCode);
}

14

27পালানোর কীটির কোড code :)


1
আমার দুটি ফাংশন থাকে যখন এন্টার টিপুন তখন ফাংশনগুলি সঠিকভাবে চালিত হয় তবে এস্কেপ কী দিয়ে নয় $ ();} if (e. which == 27) {$ ('। বাতিল')। ক্লিক করুন ();}});
শিশান্ত

document (ডকুমেন্ট) .keypress (ফাংশন (e) {y = e.keyCode? e.keyCode: e. which;}); আমি যখন (y) সতর্ক করি তখন এটি IE এবং FF এ 27 সতর্ক করে 27 আপনি কি নিশ্চিত যে আপনার কোডে অন্য কোনও ভুল নেই?
লবণ

14

আপনার সেরা বাজি হয়

$(document).keyup(function(e) { 
    if (e.which === 13) $('.save').click();   // enter 
    if (e.which === 27) $('.cancel').click(); // esc   

    /* OPTIONAL: Only if you want other elements to ignore event */
    e.preventDefault();
    e.stopPropagation();
});

সারসংক্ষেপ

  • whichkeyCodeএটি স্বাভাবিক হওয়ার চেয়ে বেশি পছন্দনীয়
  • keyupএর চেয়ে বেশি পছন্দনীয় keydownকারণ ব্যবহারকারী যদি চাপ দিয়ে রাখেন তবে কীডাউন একাধিকবার ঘটতে পারে।
  • keypressআপনি প্রকৃত অক্ষরগুলি ক্যাপচার করতে না চাইলে ব্যবহার করবেন না ।

মজার ব্যাপার হচ্ছে বুটস্ট্র্যাপ তার ড্রপডাউন উপাদানটিতে কীডাউন এবং কী কোড ব্যবহার করে (৩.০.২.২ হিসাবে)! আমি মনে করি এটি সম্ভবত খারাপ পছন্দ।

JQuery ডক থেকে সম্পর্কিত স্নিপেট

ব্রাউজারগুলি এই তথ্যগুলি সংরক্ষণ করার জন্য পৃথক পৃথক বৈশিষ্ট্যগুলি ব্যবহার করার সময়, jQuery .কোন সম্পত্তিটিকে স্বাভাবিক করে তোলে যাতে আপনি কী কোডটি পুনরুদ্ধার করার জন্য এটি নির্ভরযোগ্যভাবে ব্যবহার করতে পারেন। এই কোডটি তীরের মতো বিশেষ কীগুলির কোড সহ কীবোর্ডের একটি কী এর সাথে সম্পর্কিত। প্রকৃত পাঠ্য এন্ট্রি ধরার জন্য .keypress () আরও ভাল পছন্দ হতে পারে।

আগ্রহের অন্যান্য আইটেম: জাভাস্ক্রিপ্ট কিপ্রেস লাইব্রেরি


10

JEcreen প্লাগইন চেষ্টা করুন ( গুগল ড্রাইভ থেকে ডাউনলোড করুন )

$(document).escape(function() { 
   alert('ESC button pressed'); 
});

বা ক্রস ব্রাউজারের জন্য কীকোড পান

var code = (e.keyCode ? e.keyCode : e.which);
if (code === 27) alert('ESC');
if (code === 13) alert('ENTER');

সম্ভবত আপনি সুইচ ব্যবহার করতে পারেন

var code = (e.keyCode ? e.keyCode : e.which);
switch (code) {
    case 27:
       alert('ESC');
       break;
     case 13:
       alert('ENTER');
       break;
}

8

আপনার কোডটি ঠিক কাজ করে। এটি সম্ভবত উইন্ডো ফোকাস না thats। আমি iframe বক্স ইত্যাদি বন্ধ করতে অনুরূপ ফাংশন ব্যবহার করি etc.

$(document).ready(function(){

    // Set focus
    setTimeout('window.focus()',1000);

});

$(document).keypress(function(e) {

    // Enable esc
    if (e.keyCode == 27) {
      parent.document.getElementById('iframediv').style.display='none';
      parent.document.getElementById('iframe').src='/views/view.empty.black.html';
    }

});

8

আমি একই জিনিসটি করার চেষ্টা করছিলাম এবং এটি আমার কাছ থেকে জঞ্জাল বগাচ্ছে। ফায়ারফক্সে এটি উপস্থিত হয় যে আপনি যদি পালানোর কী টিপানো হয় এমন কিছু কাজ করার চেষ্টা করেন তবে এটি পলায়ন কীটি প্রক্রিয়াকরণ অব্যাহত রাখে যা আপনি যা করতে চেয়েছিলেন তা বাতিল করে দেয়। সতর্কতা ভাল কাজ করে। তবে আমার ক্ষেত্রে, আমি ইতিহাসে ফিরে যেতে চেয়েছিলাম যা কার্যকর হয়নি। অবশেষে বুঝতে পেরেছিলাম যে আমাকে নীচের মত দেখানো হয়েছে এমনভাবে অনুষ্ঠানের প্রচার বন্ধ করতে বাধ্য করতে হয়েছিল ...

if (keyCode == 27)
{
    history.back();

    if (window.event)
    {
        // IE works fine anyways so this isn't really needed
        e.cancelBubble = true;
        e.returnValue = false;
    }
    else if (e.stopPropagation)
    {
        // In firefox, this is what keeps the escape key from canceling the history.back()
        e.stopPropagation();
        e.preventDefault();
    }

    return (false);
}

8

অন্যান্য উত্তর কোথায় নেই তা ব্যাখ্যা করতে; সমস্যাটি আপনার ব্যবহার keypress

সম্ভবত ইভেন্টটি কেবল ভুল-নামকরণ করা হয়েছে তবে keypressকখন তা আগুনে সংজ্ঞায়িত করা হয়েছে । অর্থাৎ পাঠ্য। আপনি যা চান তা হ'ল / , যা যখনই (যথাক্রমে আগে বা পরে) আগুন দেয় । কীবোর্ডে এই জিনিসগুলি।when an actualcharacteris being inserted
keydownkeyupthe user depresses akey

পার্থক্যটি এখানে উপস্থিত হয় কারণ escএটি একটি নিয়ন্ত্রণ চরিত্র (আক্ষরিক 'প্রিন্টিং-অ-অক্ষর') এবং তাই কোনও পাঠ্য লেখেন না, এমনকি গুলি চালানোও হয় না keypress
enterঅদ্ভুত, কারণ আপনি এটি নিয়ন্ত্রণ চরিত্র হিসাবে (যেমন ইউআই নিয়ন্ত্রণ করতে) ব্যবহার করছেন, এটি এখনও একটি নতুন-লাইন অক্ষর সন্নিবেশ করছে যা আগুন জ্বলবে keypress

সূত্র: কুইরকশোড


1
চশমা পড়ার জন্য কুডোস! এটি নিশ্চিতভাবে গ্রহণযোগ্য উত্তর হওয়া উচিত :)
ডিলানইং

7

সমস্ত অক্ষরের জন্য হেক্স কোড পেতে: http://asciable.com/


2
আমি বলছিলাম ..... আমি ঘৃণা করি যে এই সাইটটি অনুসন্ধানের ফলাফলগুলির শীর্ষে রয়েছে কারণ এটি এতই কুৎসিত, তবে এটি প্রয়োজনীয় তথ্য দেয় না।
এমপেন

1
নোট করুন ইভেন্ট এবং ব্রাউজারের উপর নির্ভর করে কী কোডগুলি সবসময় এএসআইআই টেবিলের সাথে মেলে না।
অ্যালান এইচ।

2
ডাউনভোট: প্রশ্নের উত্তর দেয় না, এমনকি প্রশ্নের সমাধানও করে না, হেক্সের প্রশ্নের সাথে কোনও সম্পর্ক নেই এবং ওপি ইতিমধ্যে এসকে == 27 সম্পর্কে জ্ঞান প্রদর্শন করেছে।
জেরেমি

7

e.keyCodeএমডিএন-তে গণ্য করা বিবেচনার চেয়ে কেবল একটি আপডেট উত্তর পোস্ট করা ।

পরিবর্তে আপনার e.keyপরিবর্তে বেছে নেওয়া উচিত যা সমস্ত কিছুর জন্য পরিষ্কার নাম সমর্থন করে। এখানে প্রাসঙ্গিক অনুলিপি পাস্তা

window.addEventListener("keydown", function (event) {
  if (event.defaultPrevented) {
    return; // Do nothing if the event was already processed
  }

  switch (event.key) {
    case "ArrowDown":
      // Do something for "down arrow" key press.
      break;
    case "ArrowUp":
      // Do something for "up arrow" key press.
      break;
    case "ArrowLeft":
      // Do something for "left arrow" key press.
      break;
    case "ArrowRight":
      // Do something for "right arrow" key press.
      break;
    case "Enter":
      // Do something for "enter" or "return" key press.
      break;
    case "Escape":
      // Do something for "esc" key press.
      break;
    default:
      return; // Quit when this doesn't handle the key event.
  }

  // Cancel the default action to avoid it being handled twice
  event.preventDefault();
}, true);

3
তবে এটি কেবল ফায়ারফক্স এবং ক্রোমে সমর্থিত বলে মনে হচ্ছে।
গায়ান ওয়েরাকুট্টি


দুর্ভাগ্যক্রমে, ইন্টারনেট এক্সপ্লোরারের কমপক্ষে কয়েকটি সংস্করণ Escমানটির চেয়ে কোডটি পাস করে Escape
রবিন স্টুয়ার্ট

6

কীবোর্ড ইনপুট এবং কী সংমিশ্রণগুলি ক্যাপচারের জন্য একটি শক্তিশালী জাভাস্ক্রিপ্ট লাইব্রেরি প্রবেশ করেছে। এর কোনও নির্ভরতা নেই।

http://jaywcjlove.github.io/hotkeys/

hotkeys('enter,esc', function(event,handler){
    switch(handler.key){
        case "enter":$('.save').click();break;
        case "esc":$('.cancel').click();break;
    }
});

হট নিম্নলিখিত সংশোধনকারীদের বুঝতে পারে: , shiftoptionaltctrlcontrolcommand, এবং

নিম্নলিখিত বিশেষ কী শর্টকাট ব্যবহার করা যেতে পারে: backspacetab, clear, enter, return, esc, escape, space, up, down, left, right, home, end, pageup, pagedown, del, deleteএবং f1মাধ্যমে f19



আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.