2011-03-18 6 views
13

असल में मैं निम्नलिखित कोड का उपयोग कर एक पाठ इनपुट तत्व के लिए कस्टम मेड माउस क्लिक घटना प्रेषण करने के लिए कोशिश कर रहा हूँ (देखें इस jsFiddle):क्या माउस को प्रेषण करना संभव है() माउस एक <इनपुट प्रकार = टेक्स्ट> तत्व पर क्लिक करें?

function simulateClick(id) { 
    var clickEvent = document.createEvent("MouseEvents"); 
    clickEvent.initMouseEvent("click", true, true, window, 1, 0, 0, 0, 0, 
     false, false, false, false, 0, null); 

    var element = document.getElementById(id); 
    element.dispatchEvent(clickEvent); 
} 

यह पूरी तरह ठीक काम करता है जब मैं एक type="checkbox" तत्व पर कि कोड को चलाने लेकिन type="text" तत्व पर कॉल करने पर यह बिल्कुल काम नहीं करता है।

अब यहाँ MDN पर initMouseEvent() की परिभाषा है:

event.initMouseEvent(type, canBubble, cancelable, view, 
       detail, screenX, screenY, clientX, clientY, 
       ctrlKey, altKey, shiftKey, metaKey, 
       button, relatedTarget); 

तो screenX, screenY, clientX और clientY सभी 0 (अब भी, ऊपर कोड बिल्कुल ठीक चेक बॉक्स के साथ परवाह किए बिना काम करता है उनकी स्थिति का) होगा ऊपर के उदाहरण में। मैंने किसी वास्तविक घटना को कैप्चर करने और कुसुम किए गए कार्यक्रम में स्क्रीन और क्लाइंट निर्देशांक पास करने की कोशिश की, इसका कोई फायदा नहीं हुआ।

हालांकि शायद टेक्स्ट इनपुट तत्व सुरक्षा कारणों से कस्टम माउस ईवेंट को अनदेखा करते हैं, लेकिन फिर element.focus() या तो काम नहीं करना चाहिए, जो यह करता है।

किसी भी विचार या अंतर्दृष्टि की सराहना की जाएगी!

+0

तो मैं तुम्हें था मैं jQuery उपयोग करने पर विचार करता हूँ लाइब्रेरी और फिर 'ट्रिगर' विधि - यह महान क्रॉस ब्राउज़र का काम करता है, और आपके जीवन को बहुत आसान बना देगा :) –

+0

आप कैसे निर्धारित कर रहे हैं, क्लिक काम नहीं कर रहा है? जब मैं आपके उदाहरण पर 'ऑनक्लिक' हैंडलर जोड़ता हूं तो यह ट्रिगर हो जाता है: http://jsfiddle.net/epevj/11/ क्या आप फोकस करने की उम्मीद कर रहे हैं? तो आप 'फोकस() 'का उपयोग क्यों नहीं कर रहे हैं? – RoToRa

उत्तर

5

जहाँ तक मैं कह सकता हूं कि आपका कोड ठीक काम करता है। हालांकि यह इनपुट क्षेत्र पर ध्यान केंद्रित नहीं करता है जैसा कि आप सोच सकते हैं, लेकिन इनपुट फ़ील्ड पर ईवेंट को ठीक किया गया है, जैसा कि इस पहेली में देखा गया है: http://jsfiddle.net/ENvZY/

नोट: कोड क्रॉसब्रोसर संगत नहीं है, हालांकि यह IE8 में विफल रहता है ।

jQuery की तरह एक अच्छा crossbrowser लाइब्रेरी का उपयोग कर के बजाय देशी डोम रास्ते पर जा रहा पर विचार करें - पहिया मौजूद है और पूरी तरह से काम करता है, पुनर्रचना यह समय की बर्बादी है :)

+0

माउस क्लिक हैंडलर को वास्तव में बुलाया जाता है हालांकि इनपुट फ़ील्ड स्वचालित रूप से फोकस नहीं लेता है, क्योंकि मैंने गलत तरीके से ग्रहण किया है और आपने बताया है :) मुझे jQuery के बारे में पता है, यह अवधारणा कोड का प्रमाण था। धन्यवाद! –

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