JQuery का उपयोग करके कीबोर्ड पर एंटर दबाकर कैसे पता करें?

Question

मैं यह पता लगाना चाहूंगा कि क्या उपयोगकर्ता ने EnterjQuery का उपयोग करके दबाया है ।

यह कैसे हो सकता है? क्या इसे एक प्लगइन की आवश्यकता है?

संपादित करें: ऐसा लगता है कि मुझे keypress()विधि का उपयोग करने की आवश्यकता है ।

मैं जानना चाहता था कि क्या कोई जानता है कि उस कमांड के साथ ब्राउज़र की समस्याएं हैं - जैसे कि कोई ब्राउज़र संगतता समस्याएं हैं जिनके बारे में मुझे पता होना चाहिए?

Comments

इस बारे में लिंक .keypress () | jQuery एपीआई प्रलेखन

— Haim Evgi

जावास्क्रिप्ट फ्रेमवर्क में सबसे अच्छी चीजों में से एक यह है कि उन्हें डिफ़ॉल्ट क्रॉस-ब्राउज़र संगत होना चाहिए। वे ब्राउज़र संगतता जांच को संभालते हैं ताकि उपयोगकर्ता को न करना पड़े। मैंने JQuery के स्रोत कोड को नहीं पढ़ा है, लेकिन मुझे संदेह है कि कुंजीपट की कार्यक्षमता उस अर्थ में अलग है।

— 6

एकमात्र ब्राउज़र संगतता समस्या यह है कि आपको ascii कोड का पता लगाने के लिए e.keyCode के बजाय e.which का उपयोग करना चाहिए।

— डैनियल

stackoverflow.com/questions/302122/…

— लेमो जू

Answer 1

JQuery का पूरा बिंदु यह है कि आपको ब्राउज़र के अंतर के बारे में चिंता करने की आवश्यकता नहीं है। मुझे पूरा यकीन है कि आप enterसभी ब्राउज़रों में 13 के साथ सुरक्षित रूप से जा सकते हैं । इसे ध्यान में रखते हुए, आप यह कर सकते हैं:

$(document).on('keypress',function(e) {
    if(e.which == 13) {
        alert('You pressed enter!');
    }
});

Comments

मैं इसे लिंक कर रहा हूं क्योंकि मैंने इसे पढ़ा और मेरे सिर को खरोंच कर दिया कि क्यों IE के साथ काम नहीं किया। (यह $(window)IE के तहत नहीं होगा ) quirksmode.org/dom/events/keys.html

— Incognito

e.keyCode 100% क्रॉस ब्राउज़र नहीं है। नीचे दिखाए अनुसार e.which का उपयोग करें

— डैनियल

JQuery के दस्तावेज़ से "event.which प्रॉपर्टी event.keyCode और event.charCode को सामान्य करती है। कीबोर्ड कीम इनपुट के लिए event.which देखने की सिफारिश की गई है।"

— रिकार्डो गली

$ (दस्तावेज़) .on ('

— कीपर

मुझे ईवेंट के प्रसार (यानी, अलर्ट को दो बार फेंका जा रहा है) के कारण दिए गए फ़ंक्शन के कई निष्पादन मिल रहे हैं। इसे रोकने के लिए, फंक्शन के अंत में एक

— e.stopPropagation

Answer 2

मैंने एक ईवेंट को "कुंजी दर्ज की गई दबाया" पर बाँधना आसान बनाने के लिए एक छोटा सा प्लगइन लिखा:

$.fn.enterKey = function (fnc) {
    return this.each(function () {
        $(this).keypress(function (ev) {
            var keycode = (ev.keyCode ? ev.keyCode : ev.which);
            if (keycode == '13') {
                fnc.call(this, ev);
            }
        })
    })
}

उपयोग:

$("#input").enterKey(function () {
    alert('Enter!');
})

Comments

यह मेरे लिए काम नहीं करता है (मैं मैदान #inputपर मिला <input>)

— रैल्पी एंड्रस

अगर #input तत्व गतिशील होगा तो क्या होगा?

— जिगर J५२१

@mplungjan यकीन नहीं है कि "डेलिगेटिंग" से आपका क्या मतलब है

— एंड्रिया

$("#input").on("someevent","someselector",function () {})

— mplungjan

Answer 3

मुझे काम करने के लिए @Paolo Bergantino द्वारा पोस्ट किया गया कोड नहीं मिला, लेकिन जब मैंने इसे बदल दिया $(document)और e.whichइसके बजाय मैंने इसे गलती से काम करने के लिए e.keyCodeपाया।

$(document).keypress(function(e) {
    if(e.which == 13) {
        alert('You pressed enter!');
    }
});

जेएस बिन पर उदाहरण के लिए लिंक

Comments

मेरे लिए e.which IE के साथ काम नहीं करता है। क्या यह दूसरों के लिए काम करता है?

— उमेश राजभंडारी

IE का कौन सा संस्करण? IE7 पर मेरे लिए ठीक काम करता है।

— इयान रोके

JQuery के दस्तावेज़ से "event.which प्रॉपर्टी event.keyCode और event.charCode को सामान्य करती है। कीबोर्ड कीम इनपुट के लिए event.which देखने की सिफारिश की गई है।"

— रिकार्डो गली

Answer 4

मैंने पाया कि यह अधिक क्रॉस-ब्राउज़र संगत है:

$(document).keypress(function(event) {
    var keycode = event.keyCode || event.which;
    if(keycode == '13') {
        alert('You pressed a "enter" key in somewhere');    
    }
});

Comments

आपकी टेर्नरी IF को छोटा किया जा सकता है: var keycode = event.keyCode || event.which;

— पिस्तौल-पीट

Answer 5

आप jquery 'कीडाउन' इवेंट हैंडल का उपयोग करके ऐसा कर सकते हैं

   $( "#start" ).on( "keydown", function(event) {
      if(event.which == 13) 
         alert("Entered!");
    });

Answer 6

उपयोग event.keyऔर आधुनिक जेएस!

$(document).keypress(function(event) {
    if (event.key === "Enter") {
        // Do something
    }
});

या बिना jQuery के:

document.addEventListener("keypress", function onEvent(event) {
    if (event.key === "Enter") {
        // Do something better
    }
});

मोज़िला डॉक्स

ब्राउज़रों का समर्थन किया

Answer 7

मैंने कुछ समय इस समाधान के साथ बिताया, मुझे आशा है कि यह किसी की मदद करेगा।

$(document).ready(function(){

  $('#loginforms').keypress(function(e) {
    if (e.which == 13) {
    //e.preventDefault();
    alert('login pressed');
    }
  });

 $('#signupforms').keypress(function(e) {
    if (e.which == 13) {
      //e.preventDefault();
      alert('register');
    }
  });

});

Answer 8

एक कीपर () ईवेंट विधि है। Enter कुंजी की एससीआई संख्या 13 है और यह निर्भर नहीं करता है कि किस ब्राउज़र का उपयोग किया जा रहा है।

Answer 9

ऊपर एंड्रिया के जवाब का एक मामूली विस्तार सहायक विधि को और अधिक उपयोगी बनाता है जब आप संशोधित एंटर प्रेस (यानी ctrl-enter या shift-enter) को कैप्चर करना चाहते हैं। उदाहरण के लिए, इस प्रकार की तरह बाध्यकारी की अनुमति देता है:

$('textarea').enterKey(function() {$(this).closest('form').submit(); }, 'ctrl')

प्रपत्र सबमिट करने के लिए जब उपयोगकर्ता उस फ़ॉर्म के टेक्सारिया पर ध्यान देने के साथ ctrl-enter दबाए।

$.fn.enterKey = function (fnc, mod) {
    return this.each(function () {
        $(this).keypress(function (ev) {
            var keycode = (ev.keyCode ? ev.keyCode : ev.which);
            if ((keycode == '13' || keycode == '10') && (!mod || ev[mod + 'Key'])) {
                fnc.call(this, ev);
            }
        })
    })
}

( TEXTAREA में Ctrl + Enter jQuery भी देखें )

Answer 10

कुछ मामलों में, आपको ENTERकिसी पृष्ठ के एक निश्चित क्षेत्र के लिए कुंजी को दबाने की आवश्यकता हो सकती है, लेकिन पृष्ठ के अन्य क्षेत्रों के लिए नहीं, जैसे नीचे दिए गए पृष्ठ में SEARCH फ़ील्ड के साथ हेडर होता है ।<div>

मुझे यह पता करने में थोड़ा समय लगा कि मुझे यह कैसे करना है, और मैं इस सरल अभी तक के पूरे उदाहरण को यहां समुदाय के लिए पोस्ट कर रहा हूं।

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <title>Test Script</title>
  <script src="/lib/js/jquery-1.7.1.min.js" type="text/javascript"></script>
  <script type="text/javascript">
    $('.container .content input').keypress(function (event) {
      if (event.keyCode == 10 || event.keyCode == 13) {
        alert('Form Submission needs to occur using the Submit button.');
        event.preventDefault();
      }
    });
  </script>
</head>
  <body>
    <div class="container">
      <div class="header">
        <div class="FileSearch">
          <!-- Other HTML here -->
        </div>
      </div>
      <div class="content">
        <form id="testInput" action="#" method="post">
        <input type="text" name="text1" />
        <input type="text" name="text2" />
        <input type="text" name="text3" />
        <input type="submit" name="Submit" value="Submit" />
        </form>
      </div>
    </div>
  </body>
</html>

JSFiddle Playground से लिंक करें : [Submit]बटन कुछ भी नहीं करता है, लेकिन ENTERटेक्स्ट बॉक्स नियंत्रणों में से एक से दबाने पर फ़ॉर्म सबमिट नहीं होगा।

Answer 11

दर्ज की गई कुंजी का पता लगाने के लिए यह प्रयास करें।

$(document).on("keypress", function(e){
    if(e.which == 13){
        alert("You've pressed the enter key!");
    }
});

कीबोर्ड पर डेमो @ पता दर्ज करें कुंजी दबाएं देखें

Answer 12

चूंकि keypressघटना किसी आधिकारिक विनिर्देश द्वारा कवर नहीं की गई है, इसलिए इसका उपयोग करते समय सामना किया गया वास्तविक व्यवहार ब्राउज़र, ब्राउज़र संस्करणों और प्लेटफार्मों में भिन्न हो सकता है।

$(document).keydown(function(event) {
  if (event.keyCode || event.which === 13) {
    // Cancel the default action, if needed
    event.preventDefault();
    //call function, trigger events and everything tou want to dd . ex : Trigger the button element with a click
    $("#btn").trigger('click');
  }
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<button id="btn" onclick="console.log('Button Pressed.')">&nbsp</button>

मुझे आशा है कि यह उपयोगी होगा!

Comments

ध्यान देने का कारण keypressयह है कि (अब) कल्पना में नहीं है कि यह पदावनत ( एमडीएन ) है।

— येलोआफ्टलाइफ़ डेके

इसलिए, l संपादित ... tnx <3

— Zoe_NS

Answer 13

यह पता लगाने का आसान तरीका है कि क्या उपयोगकर्ता ने एंटर दबाया है कुंजी नंबर का उपयोग करने के लिए दर्ज करें कुंजी संख्या = 13 है अपने डिवाइस के मूल्य की जांच करने के लिए

$("input").keypress(function (e) {
  if (e.which == 32 || (65 <= e.which && e.which <= 65 + 25)
                    || (97 <= e.which && e.which <= 97 + 25)) {
    var c = String.fromCharCode(e.which);
    $("p").append($("<span/>"))
          .children(":last")
          .append(document.createTextNode(c));
  } else if (e.which == 8) {
    // backspace in IE only be on keydown
    $("p").children(":last").remove();
  }
  $("div").text(e.which);
});

एंटर की को दबाने पर आपको परिणाम 13 मिलेगा। कुंजी मूल्य का उपयोग करके आप एक फ़ंक्शन को कॉल कर सकते हैं या आप जो चाहें कर सकते हैं

        $(document).keypress(function(e) {
      if(e.which == 13) {
console.log("User entered Enter key");
          // the code you want to run 
      }
    });

यदि आप बटन को एक बार टारगेट करना चाहते हैं तो एक बार कुंजी दबाए जाने पर आप कोड का उपयोग कर सकते हैं

    $(document).bind('keypress', function(e){
  if(e.which === 13) { // return
     $('#butonname').trigger('click');
  }
});

आशा है कि यह मदद करेगा

Answer 14

मुझे लगता है कि वेनिला javacript का उपयोग करना सबसे सरल तरीका होगा :

document.onkeyup = function(event) {
   if (event.key === 13){
     alert("enter was pressed");
   }
}

Answer 15

$(function(){
  $('.modal-content').keypress(function(e){
    debugger
     var id = this.children[2].children[0].id;
       if(e.which == 13) {
         e.preventDefault();
         $("#"+id).click();
       }
   })
});

Comments

क्या आप पूछने वाले को समझाने के लिए कुछ व्याख्यात्मक टिप्पणियां जोड़ सकते हैं कि आपका कोड कैसे काम करता है - धन्यवाद।

— शशमग Sas

Answer 16

$(document).keyup(function(e) {
    if(e.key === 'Enter') {
        //Do the stuff
    }
});

Comments

यह अन्य उत्तरों के एक अनुकूलन की तरह दिखता है - क्या आप दूसरों के समान ही दिलचस्प बनाने के लिए कुछ स्पष्टीकरण जोड़ सकते हैं?

— निको हसे

Answer 17

मैंने इस्तेमाल किया $(document).on("keydown")।

कुछ ब्राउज़रों पर keyCodeसमर्थित नहीं है। उसी के साथ whichयदि keyCodeआप समर्थित नहीं हैं, तो आपको whichइसका उपयोग करने की आवश्यकता है और इसके विपरीत।

$(document).on("keydown", function(e) {
  const ENTER_KEY_CODE = 13;
  const ENTER_KEY = "Enter";
  var code = e.keyCode || e.which
  var key = e.key
  if (code == ENTER_KEY_CODE || key == ENTER_KEY) {
    console.log("Enter key pressed")
  }
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>