jQuery क्लिक करें - मोबाइल में एकाधिक क्लिक को रोकें

Question

मैं अपने आईओएस/एंड्रॉइड ऐप के निर्माण के लिए फोनगैप का उपयोग कर रहा हूं - मूल रूप से एक रिमोट जो मेरे लैपटॉप के कीबोर्ड पर कुछ कुंजियों का अनुकरण कर सकता है। (वीडियो प्लेबैक आदि को नियंत्रित करने के लिए)।

इसके वेबपृष्ठ के बाद से, मेरे पास छवियां हैं जो मेरे लैपटॉप पर मेरे जावा सॉकेट सर्वर से कनेक्ट होने पर क्लिक की जाती हैं। जिस मुद्दे का मैं सामना कर रहा हूं वह है, हर बार जब मैं एक बटन पर क्लिक करता हूं - बस एक बार (पॉज़ बटन की तरह), मुझे जावा कंसोल में 1 से अधिक अनुरोध निकाल दिए जाते हैं। लेकिन यह तब होता है जब मैं अपने फोन में क्लिक (स्पर्श) करता हूं। जब मैं अपने लैपटॉप के ब्राउज़र में ऐसा करने की कोशिश करता हूं, तो यह अपेक्षित व्यवहार करता है (केवल एक अनुरोध)।

मैं कई पदों के माध्यम से चला गया, जहां सामान्य सलाह 'unbind()' और 'off()' का उपयोग करना है, लेकिन कुछ भी काम नहीं करता है। कोड स्निपेट नीचे है।

$("#play").off().on('click',function(){ 
     //alert("Play"); 

    jQuery.ajax({ 
    type: "GET", 
    async: true, 
    url: 'http://'+ip+':10007/function=play?', 
    success: function (msg) 
     { }, 
    error: function (err) 
     { } 
    }); 
}); 

मैंने यह चेतावनी का उपयोग यह जांचने के लिए किया कि घटना को एक से अधिक बार निकाल दिया गया है या नहीं। चेतावनी सिर्फ एक बार पॉप अप होती है, जिसका मतलब है कि घटना केवल एक बार निकाल दी जाती है। तो यह सिर्फ एक बार क्लिक करें (स्पर्श करें) => एक घटना => लेकिन एकाधिक अनुरोध!

मैं कोड के इस टुकड़े के साथ सर्वर प्रतिक्रिया की जाँच कर रहा हूँ:

while(true) {     
     Socket sock = servsock.accept();     
     System.out.println("Connection from: " + sock.getInetAddress());     
     Scanner in = new Scanner(sock.getInputStream());     
     PrintWriter out = new PrintWriter(sock.getOutputStream());     
     String request = "";     
     while (in.hasNext()) { 
      request = in.next();     
      if (request.contains("function=")) 
      { 
      inputLine = request.split("function=")[1]; 
      System.out.println ("^^^^^" + inputLine); 
      ... 

आउटपुट कंसोल में तीन बार प्रकट होता है जब मोबाइल से अनुरोध किया, लेकिन सिर्फ एक बार जब अपने लैपटॉप के ब्राउज़र से अनुरोध।

मुझे समझ में नहीं आता कि यह क्यों और रोका जा सकता है कि इसे कैसे रोका जा सकता है। कोई पॉइंटर्स?

Answer 1

बटन को कितनी बार कॉल किया जा रहा है यह जांचने के लिए console.log("called") का उपयोग करें। क्रोम में आउटपुट देखने के लिए देख रहा है-> डेवलपर-> जावास्क्रिप्ट कंसोल। alert("Play"); केवल एक बार चलाया जाएगा।

Answer 2

हो सकता है कि आप इन समाधान पहले से ही करने की कोशिश की है, लेकिन मामले में आप नहीं है,

1. कोशिश ~off().on('click')~ के बजाय कॉलबैक फ़ंक्शन (सफलता या पूर्ण) में $("#play").off('click'); डाल करने के लिए।

2. कॉलबैक में return false; जोड़ें।

Answer 3

मुझे jQuery का उपयोग करके इसका एक समान अनुभव मिला है जिसमें एक क्लिक में एक मोडल को दो बार बुलाया जाता है। तब मुझे एहसास हुआ कि समस्या यह है कि मैं अपने document.ready कोड के बाहर घटनाओं का आह्वान करता हूं।

इन्हें आजमाएं। तो बजाय होने

$(function(){ 
    ... 
}); 

$("#play").off().on('click',function(){ 
    ... 
}); 

इसे इस तरह का प्रयास करें की:

$(function(){ 
    ... 

    $("#play").off().on('click',function(){ 
     ... 
    }); 
}); 

Answer 4

एक और तरीका है आप इस समस्या को हल कर सकते हैं एक ध्वज है कि आप एक बार आप बटन पर क्लिक करें सेट कर सकते हैं उपयोग कर रहा है। फिर आप ध्वज के मूल्य की जांच कर सकते हैं और झूठी वापसी कर सकते हैं; यदि मूल्य पहले ही सेट हो चुका है।

// छद्म कोड
- ध्वज को शुरुआत में झूठी रखें।
- क्लिक पर, ध्वज मूल्य की जांच करें।
- अगर ध्वज सेट है, तो झूठी वापसी करें;
- अगर ध्वज सेट नहीं है, तो ध्वज सेट करें।
- सफलता विधि कहने के बाद, मान को फिर से गलत पर रीसेट करें।

यह कम से कम एकाधिक कॉल के मुद्दे को हल करेगा। एक और अभ्यास यह निर्धारित करना होगा कि यह केवल डिवाइस पर क्यों एक मुद्दा है।

Answer 5

.on() के बजाय .one() का उपयोग करने के लिए एक बार क्लिक ईवेंट को आग लगाना एक तरीका है। यह सुनिश्चित करेगा कि घटना एक बार निकाल दी जाएगी। AJAX अनुरोध पूरा होने के बाद आप फिर से .one() फ़ंक्शन को अटैच कर सकते हैं।

आपका कोड दिखेगा कुछ की तरह:

function processOnce() { 
    //alert("Play"); 

    jQuery.ajax({ 
     type : "GET", 
     async : true, 
     url : 'http://' + ip + ':10007/function=play?', 
     success : function (msg) { 
      $("#play").one('click', processOnce()); 
     }, 
     error : function (err) {} 
    }); 
} 

$("#play").one('click', processOnce()); 

एक अन्य संभावित समाधान deviceready घटना के लिए इंतजार करना है।

<body onload="onBodyLoad()"> 

और स्क्रिप्ट के लिए: तो आपके शरीर टैग में इस ऐड

<script type="text/javascript"> 
    function onBodyLoad() { 
     document.addEventListener("deviceready", onDeviceReady, false); 
    } 

    function onDeviceReady() { 
     $(function() { 
     // bind your elements 
     }); 
    } 

अन्त में आप निर्धारित करने के लिए एक क्लिक के पहले आ गई है एक झंडा जोड़ सकते हैं। तो अपने कोड इस तरह दिखेगा:

var clicked = false; 

$("#play").on('click', function() { 
    if (clicked) 
     return; 

    clicked = true; 
    //alert("Play"); 

    jQuery.ajax({ 
     type : "GET", 
     async : true, 
     url : 'http://' + ip + ':10007/function=play?', 
     success : function (msg) { 
      clicked = false; 
     }, 
     error : function (err) {} 
    }); 
}); 

मुझे आशा है कि इस मदद करता है।