क्या मुख्य प्रेस कार्यक्रमों को प्रोग्रामेटिक रूप से अनुकरण करना संभव है?


380

क्या यह संभव है कि जावास्क्रिप्ट में प्रोग्राम प्रेस की महत्वपूर्ण घटनाओं का अनुकरण किया जाए?


2
क्या आप you अनुकरण ’को स्पष्ट कर सकते हैं? क्या आपका लक्ष्य आपकी वेबसाइट का परीक्षण करना है या किसी दिए गए लिंक की ऑन्कलिक, ऑन्मसॉउड इत्यादि को क्रियाशील बनाना है?
पाउलो

जवाबों:


180

एक गैर- jquery संस्करण जो वेबकिट और गेको दोनों में काम करता है:

var keyboardEvent = document.createEvent("KeyboardEvent");
var initMethod = typeof keyboardEvent.initKeyboardEvent !== 'undefined' ? "initKeyboardEvent" : "initKeyEvent";

keyboardEvent[initMethod](
  "keydown", // event type: keydown, keyup, keypress
  true,      // bubbles
  true,      // cancelable
  window,    // view: should be window
  false,     // ctrlKey
  false,     // altKey
  false,     // shiftKey
  false,     // metaKey
  40,        // keyCode: unsigned long - the virtual key code, else 0
  0          // charCode: unsigned long - the Unicode character associated with the depressed key, else 0
);
document.dispatchEvent(keyboardEvent);

8
फिलिप, यह उस कोड की तरह दिखता है जिसकी मुझे आवश्यकता है, लेकिन मुझे कीपर इवेंट को एक टेक्स्टारिया में भेजने की आवश्यकता है। मैं एक textarea को भेजने के लिए अपने कोड को संशोधित करने की कोशिश की, लेकिन यह कम से कम क्रोम में काम करने के लिए प्रकट होता है, किसी भी विचार क्या गलत हो सकता है? यहाँ jsfiddle है जिसे मैंने प्रदर्शित करने के लिए बनाया है: jsfiddle.net/szmJu
user280109

4
कीबोर्ड में एक बग है जो कीबोर्डएवेंट प्रेषण के साथ है। अधिक जानकारी के लिए इस धागे को देखें: stackoverflow.com/questions/10455626/…
फिलिप नाज़नी

26
keyCodeहमेशा 0 होता है, और मैं इसे बदल नहीं सकता।
अता इरावनी

9
ऐसा प्रतीत होता है कि क्रोमियम में एक बग है जो उपयोग करते समय event.whichहमेशा होने का कारण बनता है । @lluft ने विवरण और एक वर्कअराउंड साझा किया, जिसने मेरे लिए एक अलग थ्रेड पर इस टिप्पणी में काम किया । असल में, आपको एक सामान्य घटना बनाने के लिए उपयोग करने की आवश्यकता है और फिर कुंजी के चारकोड के बराबर संपत्ति सेट करने और देने के लिए उपयोग करना होगा। 0document.createEvent("KeyboardEvent")document.createEvent('Event')keydownkeyCode
ए-डिड्डी

8
ऐसा लगता है कि यह सुविधा अब तक हटा दी गई है। एमडीएन ने इसे काफी समय के लिए पदावनत माना है, हालांकि।
टैक्टिकस

72

यदि आप jQuery 1.3.1 का उपयोग करने के लिए ठीक हैं:

function simulateKeyPress(character) {
  jQuery.event.trigger({ type : 'keypress', which : character.charCodeAt(0) });
}

$(function() {
  $('body').keypress(function(e) {
    alert(e.which);
  });

  simulateKeyPress("e");
});

हाय मेरा क्या मतलब है: 1. एक प्रमुख घटना रजिस्टर (पत्र ई कुछ जेएस निष्पादित करता है) 2. एक अन्य विधि से मैं प्रोग्राम ई को प्रेस करना चाहता हूं)
tan

9
यह क्रोम में ठीक से काम नहीं करता है, क्षमा करें। jQuery इवेंट बनाता है, लेकिन महत्वपूर्ण विशेषताओं के बिना - जो, चारकोड, कीकोड।
हम्खू

4
@ यह संभव नहीं है। इसके पीछे के तर्क के लिए मेरा जवाब देखें।
लॉरेंज लो सॉयर


51

आप जो कर सकते हैं, वह प्रोग्रामेटिक रूप से कीवर्स श्रोताओं को कीरिंग फायरिंग द्वारा ट्रिगर करना है । यह सैंडबॉक्स वाली सुरक्षा-परिप्रेक्ष्य से इसे अनुमति देने के लिए समझ में आता है। इस क्षमता का उपयोग करते हुए, आप फिर एक सामान्य पर्यवेक्षक-पैटर्न लागू कर सकते हैं । आप इस पद्धति को "अनुकरण" कह सकते हैं।

नीचे jQuery के साथ W3C DOM मानक में इसे पूरा करने का एक उदाहरण नीचे दिया गया है:

function triggerClick() {
  var event = new MouseEvent('click', {
    'view': window,
    'bubbles': true,
    'cancelable': true
  });
  var cb = document.querySelector('input[type=submit][name=btnK]'); 
  var canceled = !cb.dispatchEvent(event);
  if (canceled) {
    // preventDefault was called and the event cancelled
  } else {
    // insert your event-logic here...
  }
}

यह उदाहरण इससे अनुकूलित किया गया है: https://developer.mozilla.org/en-US/docs/Web/Guide/Events/Creating_and_triggering_events

JQuery में:

jQuery('input[type=submit][name=btnK]')
  .trigger({
    type: 'keypress',
    which: character.charCodeAt(0 /*the key to trigger*/)      
   });

लेकिन हाल ही में, ब्राउज़र-सैंडबॉक्स छोड़ने वाले वास्तव में कुंजीवेट को ट्रिगर करने का कोई [डीओएम] तरीका नहीं है। और सभी प्रमुख ब्राउज़र विक्रेता उस सुरक्षा अवधारणा का पालन करेंगे।

Adobe Flash जैसे प्लगइन्स के लिए - जो कि NPAPI- पर आधारित हैं, और सैंडबॉक्स को दरकिनार कर परमिट: ये चरणबद्ध हैं ; फ़ायरफ़ॉक्स

विस्तृत विवरण:

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

विकल्प और अधिक जानकारी के लिए इस पोस्ट को देखें। हमेशा फ्लैश आधारित कॉपी और पेस्ट होता है। यहाँ एक सुंदर उदाहरण है । उसी समय यह एक गवाही है कि वेब प्लगइन विक्रेताओं से दूर क्यों जा रहा है।

दूरस्थ सामग्री को प्रोग्रामेटिक रूप से एक्सेस करने के लिए ऑप्ट-इन कॉर्स पॉलिसी के मामले में एक समान सुरक्षा मानसिकता लागू होती है ।

इसका उत्तर है:
सामान्य परिस्थितियों में सैंडबॉक्स वाले ब्राउज़र वातावरण में प्रोग्राम की इनपुट कुंजी को ट्रिगर करने का कोई तरीका नहीं है

बॉटमलाइन: मैं यह नहीं कह रहा हूं कि यह भविष्य में गेमिंग के अंत-लक्ष्य के लिए विशेष ब्राउज़र-मोड और / या विशेषाधिकारों या इसी तरह के उपयोगकर्ता-अनुभवों के तहत संभव नहीं होगा। हालांकि ऐसे मोड में प्रवेश करने से पहले, उपयोगकर्ता को फुलस्क्रीन एपीआई मॉडल के समान अनुमति और जोखिम के लिए कहा जाएगा ।

उपयोगी: KeyCodes के संदर्भ में, यह टूल और कीकोड मैपिंग काम में आएगा।

प्रकटीकरण: उत्तर यहां के उत्तर पर आधारित है


तो जावास्क्रिप्ट के साथ KeyboardEvent API ( developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent ) आप प्रमुख घटनाओं का अनुकरण कर सकते हैं, उदाहरण के लिए कह सकते हैं कि एक कुंजी दबाया जाता है, लेकिन कुंजी प्रेस प्रभाव होना संभव नहीं है , जैसे अक्षर 'a', 'b', 'c' लिखना? यदि यह संभव है, तो इन मूल चरित्रों को लिखना एक सुरक्षा समस्या नहीं है, लेकिन मैं समझता हूं कि "F12" या "Alt + F4" जैसे संयोजन की एक विशेष कुंजी को मना किया जाना चाहिए।
बपतिस्मा

1
क्रोम में आपका jQuery चलाने पर मुझे यही मिलता है: बिना संदर्भ दिए गए संदर्भ: चरित्र परिभाषित नहीं है
Jayden Lawson

29

आप इस तरह एक तत्व पर कीबोर्ड घटनाओं को भेज सकते हैं

element.dispatchEvent(new KeyboardEvent('keypress',{'key':'a'}));

12
मुझे लगता है कि उत्तर में इस तथ्य का उल्लेख करना चाहिए कि जेएस घटना में भेजा गया इनपुट सामग्री को अपडेट नहीं करता है।
किरिल रेजनिकोव

5
नवीनतम फ़ायरफ़ॉक्स आधुनिक नहीं है?
एमिक्स

लगता है कि keypressमूल्यह्रास हुआ है, का उपयोग कर keydownके बजाय -> developer.mozilla.org/en-US/docs/Web/Events/keypress
JMT2080AD

यह मेरे लिए क्रोम एंबेडेड के साथ पूरी तरह से काम करता है, जैसा कि मुझे चाहिए।
पाउलो फ्रांका लैकरडा

25

आप उपयोग कर सकते हैं dispatchEvent():

function simulateKeyPress() {
  var evt = document.createEvent("KeyboardEvent");
  evt.initKeyboardEvent("keypress", true, true, window,
                    0, 0, 0, 0,
                    0, "e".charCodeAt(0))
  var body = document.body;
  var canceled = !body.dispatchEvent(evt);
  if(canceled) {
    // A handler called preventDefault
    alert("canceled");
  } else {
    // None of the handlers called preventDefault
    alert("not canceled");
  }
}

मैंने इसका परीक्षण नहीं किया, लेकिन यह डिस्पैचवेंट () के प्रलेखन पर कोड से अनुकूलित है । आप शायद उस के माध्यम से पढ़ना चाहते हैं, और createEvent () और initKeyEvent () के लिए डॉक्स भी।


15
नोट: यह केवल गेको ब्राउज़र द्वारा समर्थित है।
20

3
गेको और अन्य ब्राउज़र इस पर असहमत थे कि क्या उपयोग करना है initKeyEventया नहीं initKeyboardEvent()। दोनों KeyboardEvent () कंस्ट्रक्टर का उपयोग करने के पक्ष में पदावनत हैं ।
jkmartindale

21

आप कीबोर्ड ईवेंट बना सकते हैं और भेज सकते हैं, और वे उपयुक्त पंजीकृत ईवेंट हैंडलर को ट्रिगर करेंगे, हालांकि वे किसी भी पाठ का उत्पादन नहीं करेंगे उदाहरण के लिए इनपुट तत्व को भेजे जाने पर, ।

पाठ इनपुट को पूरी तरह से अनुकरण करने के लिए आपको कीबोर्ड ईवेंट के अनुक्रम का उत्पादन करने की आवश्यकता है और इनपुट तत्व के पाठ को स्पष्ट रूप से सेट करना होगा। घटनाओं का क्रम इस बात पर निर्भर करता है कि आप टेक्स्ट इनपुट को कितनी अच्छी तरह से अनुकरण करना चाहते हैं।

सबसे सरल रूप होगा:

$('input').val('123');
$('input').change();

15

कुछ मामलों में keypressघटना आवश्यक फ़ंक्शनलिटी प्रदान नहीं कर सकती है। से मोज़िला डॉक्स हम देख सकते हैं कि सुविधा को अनुचित है:

यह सुविधा अब अनुशंसित नहीं है। हालांकि कुछ ब्राउज़र अभी भी इसका समर्थन कर सकते हैं, यह पहले से ही संबंधित वेब मानकों से हटा दिया गया हो सकता है, गिराए जाने की प्रक्रिया में हो सकता है, या केवल संगतता उद्देश्यों के लिए रखा जा सकता है। इसका उपयोग करने से बचें, और यदि संभव हो तो मौजूदा कोड अपडेट करें; अपने निर्णय का मार्गदर्शन करने के लिए इस पृष्ठ के नीचे संगतता तालिका देखें। विदित हो कि यह सुविधा किसी भी समय काम करना बंद कर सकती है।

इसलिए, चूंकि keypressघटना दो परिणामी घटनाओं से संयुक्त है keydown, और keyupउसी कुंजी के लिए निम्नलिखित , बस घटनाओं को एक-एक करके उत्पन्न करें:

element.dispatchEvent(new KeyboardEvent('keydown',{'key':'Shift'}));
element.dispatchEvent(new KeyboardEvent('keyup',{'key':'Shift'}));

13

Alex2k8 से उत्तर पर निर्माण, यहाँ एक संशोधित संस्करण है जो सभी ब्राउज़रों में काम करता है जो jQuery का समर्थन करता है (समस्या jQuery.event.trigger के लिए लापता तर्क में थी, जो उस आंतरिक फ़ंक्शन का उपयोग करते समय भूलना आसान है)।

// jQuery plugin. Called on a jQuery object, not directly.
jQuery.fn.simulateKeyPress = function (character) {
  // Internally calls jQuery.event.trigger with arguments (Event, data, elem).
  // That last argument, 'elem', is very important!
  jQuery(this).trigger({ type: 'keypress', which: character.charCodeAt(0) });
};

jQuery(function ($) {
  // Bind event handler
  $('body').keypress(function (e) {
    alert(String.fromCharCode(e.which));
    console.log(e);
  });
  // Simulate the key press
  $('body').simulateKeyPress('x');
});

आप इसे और भी आगे बढ़ा सकते हैं और इसे न केवल घटना का अनुकरण करने दें, बल्कि वास्तव में चरित्र डालें (यदि यह एक इनपुट तत्व है), हालांकि ऐसा करने की कोशिश करते समय कई क्रॉस-ब्राउज़र गोचरा होते हैं। बेहतर SendKeys जैसे अधिक विस्तृत प्लगइन का उपयोग करें ।


1
SendKeys keypresses का अनुकरण नहीं करता है यह सिर्फ लक्ष्य तत्वों में मूल्यों को इंजेक्ट करता है।
अहमद मसूद

2
एक हार्डवेयर कीप का अनुकरण नहीं, बस बाइंडेड कीप फ़ंक्शन को कॉल करना।
कोडबीट

8

रुचि रखने वालों के लिए, आप वास्तव में, कीबोर्ड इनपुट घटनाओं को मज़बूती से फिर से बना सकते हैं। इनपुट क्षेत्र में पाठ बदलने के लिए (कर्सर को स्थानांतरित करें, या इनपुट चरित्र के माध्यम से पृष्ठ) आपको DOM इवेंट मॉडल को बारीकी से पालन करना होगा: http://www.w3.org/TR/DOM-Level-3-Events/ # h4_events-inputevents

मॉडल को करना चाहिए:

  • फोकस (लक्ष्य सेट के साथ डोम पर भेजा गया)

फिर प्रत्येक वर्ण के लिए:

  • कीडाउन (DOM पर भेजा गया)
  • प्रीनिटपुट (लक्ष्य पर भेजे जाने पर यदि इसका कोई पाठ या इनपुट)
  • कीप (डोम पर भेजा गया)
  • इनपुट (अगर एक textarea या इनपुट लक्ष्य पर भेजा)
  • परिवर्तन (यदि इसका चयन हो तो लक्ष्य पर भेजा गया)
  • कीप (डोम पर भेजा गया)

फिर, वैकल्पिक रूप से अधिकांश के लिए:

  • धब्बा (लक्ष्य सेट के साथ DOM पर भेजा गया)

यह वास्तव में जावास्क्रिप्ट के माध्यम से पृष्ठ में पाठ को बदलता है (मूल्य विवरणों को संशोधित किए बिना) और किसी भी श्रोता / संचालकों को उचित रूप से सेट करता है। यदि आप गड़बड़ करते हैं अनुक्रम जावास्क्रिप्ट उपयुक्त क्रम में फायर नहीं करेगा, तो इनपुट बॉक्स में पाठ नहीं बदलेगा, चयन नहीं बदलेगा या कर्सर पाठ क्षेत्र में अगले स्थान पर नहीं जाएगा।

दुर्भाग्य से कोड एक एनडीए के तहत एक नियोक्ता के लिए लिखा गया था इसलिए मैं इसे साझा नहीं कर सकता, लेकिन यह निश्चित रूप से संभव है लेकिन आपको सही क्रम में प्रत्येक तत्व के लिए संपूर्ण कुंजी इनपुट "स्टैक" को फिर से बनाना होगा।


8
जावास्क्रिप्ट के लिए एनडीए? वास्तव में? , वैसे भी प्रत्येक वर्ण के लिए आपका एल्गोरिथ्म गलत है, "इनपुट" ईवेंट का अनुकरण करना वैसे भी पूरे कीडाउन, कीप इवेंट या किसी अन्य ईवेंट के बिना पाठ जोड़ता है। समस्या यह है कि "बटन" को दबाने और कई बार "आआआआ" की अपेक्षा करते हुए कई कीप इवेंट आदि को कैसे हैंडल किया जाए।
आकाश काव

1
चाल एक कीडाउन, इनपुट, फिर कीअप को आग लगाने के लिए है। यदि आप एकाधिक "आआआआ" चाहते हैं, तो इनपुट ईवेंट को बंद रखें। और किसी को मत बताना।
ट्रेवर

4
मैंने इसे आज़माया, लेकिन यह पूरी तरह से काम नहीं करता है: मैं एंटर, बैकस्पेस या एरो कुंजियों के लिए ईवेंट को ट्रिगर कर सकता हूं, लेकिन पात्रों के साथ नहीं। उदाहरण के लिए, मैं इस पद्धति के माध्यम से पाठ इनपुट नहीं कर सकता, हालांकि मैंने घटनाओं के आपके आदेश का बारीकी से पालन किया है।
टैक्टिकस

@ टैक्टिक संयोग से आपके पास अभी भी इस जवाब के अनुसार दर्ज करने के लिए कोड नमूना है?
सियावास

1
मैंने यह प्रयास किया, कोई भाग्य नहीं।
मेसन

8

2019 तक, इस समाधान ने मेरे लिए काम किया है:

document.dispatchEvent(
  new KeyboardEvent("keydown", {
    key: "e",
    keyCode: 69, // example values.
    code: "KeyE", // put everything you need in this object.
    which: 69,
    shiftKey: false, // you don't need to include values
    ctrlKey: false,  // if you aren't going to use them.
    metaKey: false   // these are here for example's sake.
  })
);

मैंने अपने ब्राउज़र गेम में इसका उपयोग एक नकली कीपैड के साथ मोबाइल उपकरणों का समर्थन करने के लिए किया।

स्पष्टता: यह कोड एक keydownघटना को प्रेषित करता है , जबकि एक वास्तविक कुंजी प्रेस एक keydownघटना (या उनमें से कई अगर यह लंबे समय तक आयोजित होता है) को ट्रिगर करेगा , और तब एक keyupघटना जब आप उस कुंजी को जारी करेंगे। यदि आपको keyupघटनाओं की भी आवश्यकता है, तो keyupघटनाओं को बदलकर अनुकरण करना भी संभव है"keydown" के लिए "keyup"कोड स्निपेट में।

यह ईवेंट को पूरे वेबपेज पर भी भेजता है, इसलिए document। यदि आप घटना को प्राप्त करने के लिए केवल एक विशिष्ट तत्व चाहते हैं, तो आप documentवांछित तत्व के लिए स्थानापन्न कर सकते हैं ।


1
यह एकमात्र समाधान है जो मेरे लिए Qt QWebEngine runJavascript फ़ंक्शन में काम करता है। धन्यवाद
मैक्सएक्स

पूरी तरह से किसी कारण के लिए फ़्लैश खेल द्वारा नजरअंदाज कर दिया (हो सकता है कि फ्लैश सब कुछ है कि उपेक्षा नहीं करता है Trusted?)
14:30

@hanshenrik - ईमानदार होने के लिए, यदि आप 2020 में फ्लैश का उपयोग कर रहे हैं, तो आपको वास्तव में इस बात पर पुनर्विचार करने की आवश्यकता है कि कौन से उपकरण आपके उद्देश्य के लिए सबसे उपयुक्त हैं।
हैली

7

यह दृष्टिकोण मुख्य कोड के मूल्य को बदलते हुए क्रॉस-ब्राउज़र का समर्थन करता है । स्रोत

var $textBox = $("#myTextBox");

var press = jQuery.Event("keypress");
press.altGraphKey = false;
press.altKey = false;
press.bubbles = true;
press.cancelBubble = false;
press.cancelable = true;
press.charCode = 13;
press.clipboardData = undefined;
press.ctrlKey = false;
press.currentTarget = $textBox[0];
press.defaultPrevented = false;
press.detail = 0;
press.eventPhase = 2;
press.keyCode = 13;
press.keyIdentifier = "";
press.keyLocation = 0;
press.layerX = 0;
press.layerY = 0;
press.metaKey = false;
press.pageX = 0;
press.pageY = 0;
press.returnValue = true;
press.shiftKey = false;
press.srcElement = $textBox[0];
press.target = $textBox[0];
press.type = "keypress";
press.view = Window;
press.which = 13;

$textBox.trigger(press);

7

बस CustomEvent का उपयोग करें

Node.prototype.fire=function(type,options){
     var event=new CustomEvent(type);
     for(var p in options){
         event[p]=options[p];
     }
     this.dispatchEvent(event);
}

4 पूर्व ctrl + z का अनुकरण करना चाहते हैं

window.addEventListener("keyup",function(ev){
     if(ev.ctrlKey && ev.keyCode === 90) console.log(ev); // or do smth
     })

 document.fire("keyup",{ctrlKey:true,keyCode:90,bubbles:true})

मैं आपके कोड की कोशिश कर रहा हूं। यदि मैं एक कुंजी दबाता हूं तो मैं श्रोता में पहुंच जाता हूं, लेकिन document.fire का कोई प्रभाव नहीं पड़ता है।
मार्क

"" "कोई समस्या नहीं है। मैंने इसे तुरंत ठीक कर दिया है। यह अभी document.fire के बाद इसमें नहीं आ रहा है। BTW, मैं एक आइकन पर क्लिक करके इसे ट्रिगर कर रहा हूं।
मार्क

मेरा कोड कुछ इस तरह है: <img src = "settings.svg" height = "22" चौड़ाई = "24" शैली = "कर्सर: सूचक;" ng-click = "openAdminConsole ()"> openAdminConsole () में मैं document.fire कर रहा हूं। क्या यह सही नहीं है?
मार्क

4

यहाँ एक पुस्तकालय है जो वास्तव में मदद करता है: https://cdn.rawgit.com/ccampbell/mousetrap/2e5c2a8adbe80a89050aaf4e02c45f02f1cc12d4/tests/libs/key-event.js

मुझे नहीं पता कि यह कहां से आया है, लेकिन यह मददगार है। यह एक कहते हैं .simulate()करने के लिए विधि window.KeyEventहै, तो आप यह बस के साथ प्रयोग KeyEvent.simulate(0, 13)एक अनुकरण के लिए enterया KeyEvent.simulate(81, 81)एक के लिए 'Q'

मुझे यह https://github.com/ccampbell/mousetrap/tree/master/tests पर मिला ।


4

यह मेरे लिए काम करता है और यह मेरे टेक्टेरा के लिए एक कीप अनुकरण करता है। अगर आप इसे पूरे पृष्ठ के लिए चाहते हैं तो बस डाल KeySimulation()पर <body>इस तरह <body onmousemove="KeySimulation()">या नहीं तो onmousemoveउसके बाद onmouseoverया onloadकाम करता है भी।

<script>
function KeySimulation()
{
var e = document.createEvent("KeyboardEvent");
if (e.initKeyboardEvent) {  // Chrome, IE
    e.initKeyboardEvent("keyup", true, true, document.defaultView, "Enter", 0, "", false, "");
} else { // FireFox
    e.initKeyEvent("keyup", true, true, document.defaultView, false, false, false, false, 13, 0);
}
document.getElementById("MyTextArea").dispatchEvent(e);
}
</script>

<input type="button" onclick="KeySimulation();" value=" Key Simulation " />
<textarea id="MyTextArea" rows="15" cols="30"></textarea>

2
चेतावनी दी है कि initKeyboardEventपदावनत किया जाता है। ( स्रोत )
रेडियोविजुअल

4

कंसोल संदर्भ में आसान उपयोग के कारण इसे एकल पंक्तिबद्ध किया गया था। लेकिन शायद अभी भी उपयोगी है।

    var pressthiskey = "q"/* <-- q for example */;
    var e = new Event("keydown");
    e.key = pressthiskey;
    e.keyCode = e.key.charCodeAt(0);
    e.which = e.keyCode;
    e.altKey = false;
    e.ctrlKey = true;
    e.shiftKey = false;
    e.metaKey = false;
    e.bubbles = true;
    document.dispatchEvent(e);

2

यहां एक समाधान है जो क्रोम और क्रोमियम में काम करता है (केवल इन प्लेटफार्मों का परीक्षण किया है)। ऐसा लगता है कि क्रोम में कुंजी कोड को संभालने के लिए कुछ बग या स्वयं का दृष्टिकोण है, इसलिए इस संपत्ति को अलग से KeyboardEvent में जोड़ना होगा।

function simulateKeydown (keycode,isCtrl,isAlt,isShift){
    var e = new KeyboardEvent( "keydown", { bubbles:true, cancelable:true, char:String.fromCharCode(keycode), key:String.fromCharCode(keycode), shiftKey:isShift, ctrlKey:isCtrl, altKey:isAlt } );
    Object.defineProperty(e, 'keyCode', {get : function() { return this.keyCodeVal; } });     
    e.keyCodeVal = keycode;
    document.dispatchEvent(e);
}

1

यह वही है जो मैंने पाया:

function createKeyboardEvent(name, key, altKey, ctrlKey, shiftKey, metaKey, bubbles) {
  var e = new Event(name)
  e.key = key
  e.keyCode = e.key.charCodeAt(0)
  e.which = e.keyCode
  e.altKey = altKey
  e.ctrlKey = ctrlKey
  e.shiftKey = shiftKey
  e.metaKey =  metaKey
  e.bubbles = bubbles
  return e
}

var name = 'keydown'
var key = 'a'

var event = createKeyboardEvent(name, key, false, false, false, false, true)

document.addEventListener(name, () => {})
document.dispatchEvent(event)

1

टाइपस्क्रिप्ट समर्थित समाधान के साथ मूल जावास्क्रिप्ट:

KeyCode या जो भी संपत्ति आप उपयोग कर रहे हैं उसे टाइप करें और इसे KeyboardEventInit में डालें

उदाहरण

const event = new KeyboardEvent("keydown", {
          keyCode: 38,
        } as KeyboardEventInit);

1

यही मैंने क्रोम में js / टाइपस्क्रिप्ट के साथ आजमाया। प्रेरणा के इस जवाब के लिए धन्यवाद ।

const x = document.querySelector('input');

const keyboardEvent = new KeyboardEvent("keypress", { bubbles: true });
Object.defineProperty(keyboardEvent, "charCode", {
  get() {
    return 13;
  },
});
x.dispatchEvent(keyboardEvent);

0

जैसे ही उपयोगकर्ता प्रश्न में कुंजी दबाता है, आप उस संदर्भ को भी संग्रहीत कर सकते हैं और इसे किसी अन्य HTML तत्व पर भी उपयोग कर सकते हैं:

EnterKeyPressToEmulate<input class="lineEditInput" id="addr333_1" type="text" style="width:60%;right:0%;float:right" onkeydown="keyPressRecorder(event)"></input>
TypeHereToEmulateKeyPress<input class="lineEditInput" id="addr333_2" type="text" style="width:60%;right:0%;float:right" onkeydown="triggerKeyPressOnNextSiblingFromWithinKeyPress(event)">
Itappears Here Too<input class="lineEditInput" id="addr333_3" type="text" style="width:60%;right:0%;float:right;" onkeydown="keyPressHandler(event)">
<script>
var gZeroEvent;
function keyPressRecorder(e)
{
  gZeroEvent = e;
}
function triggerKeyPressOnNextSiblingFromWithinKeyPress(TTT)
{
  if(typeof(gZeroEvent) != 'undefined')  {
TTT.currentTarget.nextElementSibling.dispatchEvent(gZeroEvent);
keyPressHandler(TTT);
  }
}
function keyPressHandler(TTT)
{
  if(typeof(gZeroEvent) != 'undefined')  {
TTT.currentTarget.value+= gZeroEvent.key;
event.preventDefault();
event.stopPropagation();
  }
}
</script>

यदि आप अपना स्वयं का ईवेंट बनाते हैं, तो आप कीकोड सेट कर सकते हैं, आप किसी भी वास्तविक कीबोर्ड ईवेंट से मौजूदा मापदंडों को कॉपी कर सकते हैं (इसके प्रेषण के बाद से लक्ष्यों को अनदेखा करना) और:

ta = new KeyboardEvent('keypress',{ctrlKey:true,key:'Escape'})

0

मुझे पता है कि प्रश्न एक कुंजीपट के अनुकरण के एक जावास्क्रिप्ट तरीके के लिए पूछता है। लेकिन उन लोगों के लिए जो चीजों को करने का एक jQuery तरीका ढूंढ रहे हैं:

var e = jQuery.Event("keypress");
e.which = 13 //or e.keyCode = 13 that simulates an <ENTER>
$("#element_id").trigger(e); 

0

काम करने के लिए इस होने का महत्वपूर्ण हिस्सा है कि एहसास है charCode, keyCodeऔर whichकर रहे हैं सभी तरीकों पदावनत । इसलिए अगर कोड प्रसंस्करण कुंजी प्रेस ईवेंट को इन तीनों में से किसी का भी उपयोग करता है, तो उसे एक फर्जी उत्तर (जैसे 0 का डिफ़ॉल्ट) प्राप्त होगा।

जब तक आप एक गैर-पदावनत विधि के साथ कुंजी प्रेस घटना का उपयोग करते हैं, जैसे कि key, आपको ठीक होना चाहिए।

पूरा होने के लिए, मैंने इवेंट को ट्रिगर करने के लिए मूल जावास्क्रिप्ट कोड जोड़ा है:

const rightArrowKey = 39
const event = new KeyboardEvent('keydown',{'key':rightArrowKey})
document.dispatchEvent(event)

0

मैं एक 'टैब' प्रेस का अनुकरण करना चाहता था ... ट्रेवर के जवाब पर विस्तार करते हुए, हम देख सकते हैं कि 'टैब' की तरह एक विशेष कुंजी दबाया जाता है, लेकिन हम वास्तविक परिणाम नहीं देखते हैं जो एक 'टैब' प्रेस होगा .. ।

इन घटनाओं को 'सक्रियकरण' के साथ-साथ वैश्विक दस्तावेज़ ऑब्जेक्ट दोनों के लिए भेजने की कोशिश की - दोनों को नीचे जोड़ा गया;

नीचे स्निपेट :

var element = document.getElementById("firstInput");

document.addEventListener("keydown", function(event) {

  console.log('we got key:', event.key, '  keyCode:', event.keyCode, '  charCode:', event.charCode);

  /* enter is pressed */
  if (event.keyCode == 13) {
    console.log('enter pressed:', event);

    setTimeout(function() {
      /*  event.keyCode = 13;  event.target.value += 'b';  */

      theKey = 'Tab';
      var e = new window.KeyboardEvent('focus', {
        bubbles: true,
        key: theKey,
        keyCode: 9,
        charCode: 0,
      });
      document.activeElement.dispatchEvent(e);
      e = new window.KeyboardEvent('keydown', {
        bubbles: true,
        key: theKey,
        keyCode: 9,
        charCode: 0,
      });
      document.activeElement.dispatchEvent(e);
      e = new window.KeyboardEvent('beforeinput', {
        bubbles: true,
        key: theKey,
        keyCode: 9,
        charCode: 0,
      });
      document.activeElement.dispatchEvent(e);
      e = new window.KeyboardEvent('keypress', {
        bubbles: true,
        key: theKey,
        keyCode: 9,
        charCode: 0,
      });
      document.activeElement.dispatchEvent(e);
      e = new window.KeyboardEvent('input', {
        bubbles: true,
        key: theKey,
        keyCode: 9,
        charCode: 0,
      });
      document.activeElement.dispatchEvent(e);
      e = new window.KeyboardEvent('change', {
        bubbles: true,
        key: theKey,
        keyCode: 9,
        charCode: 0,
      });
      document.activeElement.dispatchEvent(e);
      e = new window.KeyboardEvent('keyup', {
        bubbles: true,
        key: theKey,
        keyCode: 9,
        charCode: 0,
      });
      document.activeElement.dispatchEvent(e);
    }, 4);

    setTimeout(function() {
      theKey = 'Tab';
      var e = new window.KeyboardEvent('focus', {
        bubbles: true,
        key: theKey,
        keyCode: 9,
        charCode: 0,
      });
      document.dispatchEvent(e);
      e = new window.KeyboardEvent('keydown', {
        bubbles: true,
        key: theKey,
        keyCode: 9,
        charCode: 0,
      });
      document.dispatchEvent(e);
      e = new window.KeyboardEvent('beforeinput', {
        bubbles: true,
        key: theKey,
        keyCode: 9,
        charCode: 0,
      });
      document.dispatchEvent(e);
      e = new window.KeyboardEvent('keypress', {
        bubbles: true,
        key: theKey,
        keyCode: 9,
        charCode: 0,
      });
      document.dispatchEvent(e);
      e = new window.KeyboardEvent('input', {
        bubbles: true,
        key: theKey,
        keyCode: 9,
        charCode: 0,
      });
      document.dispatchEvent(e);
      e = new window.KeyboardEvent('change', {
        bubbles: true,
        key: theKey,
        keyCode: 9,
        charCode: 0,
      });
      document.dispatchEvent(e);
      e = new window.KeyboardEvent('keyup', {
        bubbles: true,
        key: theKey,
        keyCode: 9,
        charCode: 0,
      });
      document.dispatchEvent(e);
    }, 100);



  } else if (event.keyCode != 0) {
    console.log('we got a non-enter press...: :', event.key, '  keyCode:', event.keyCode, '  charCode:', event.charCode);
  }

});
<h2>convert each enter to a tab in JavaScript... check console for output</h2>
<h3>we dispatchEvents on the activeElement... and the global element as well</h3>

<input type='text' id='firstInput' />
<input type='text' id='secondInput' />

<button type="button" onclick="document.getElementById('demo').innerHTML = Date()">
    Click me to display Date and Time.</button>
<p id="demo"></p>

हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.