jQuery Mobile vclick дважды запускается

У меня проблема с событиями vclick (или click) при запуске.jQuery Mobile vclick дважды запускается

Это мой HTML-код:

<!doctype html> 
<html> 
<head> 
    <meta charset="UTF-8"> 
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no"> 
    <title>Document</title>  
    <link rel="stylesheet" href="css/jquery.mobile-1.3.1.css"> 
    <link rel="stylesheet" href="css/estilo.css"> 
    <script src="js/cordova-2.6.0.js"></script> 
    <script src="js/jquery-2.0.0.js"></script> 
    <script src="js/functions.js"></script> 
    <script src="js/jquery.mobile-1.3.1.js"></script> 

    </head> 
    <body> 
     <div data-role="page" id="page"> 
      <div data-role="header" position="fixed"> 
      <h1>Data</h1> 
      </div> 
      <div data-role="content">  
        <div id="btn_comentar"> 
        <a href="#page4"></a> 
        </div> 
       </div> 
     </div> 
    </body> 
    </html>

И это мой functions.js

$(document).bind("mobileinit", function(){ 

    $(document).bind("pageinit",function(){ 

     $("#btn_comentar").bind("vclick",function(e){ 

      console.log(e.isDefaultPrevented()); 
      console.log(e.result); 
      console.log(e.relatedTarget); 
      alert("buttooon"); 

       list_comments(); 

      }); 

    }); 

}

Когда я нажимаю мой #btn_comentar, данные, которые я хочу, чтобы извлечь из функции list_comments (отправка через ajax) дублируется; Я понял, что он посылает дважды, и, наконец, что-то было, когда я нажал на свою кнопку.

Это выход из консоли (дважды): ложных неопределенного нуль

, а также предупреждение окна сообщения (дважды) «buttoon»;

Я пробовал некоторые решения, такие как:

jQuery Mobile : replace click event by vclick event

, но без успеха, пожалуйста, нужна помощь

Это мой новый код и как он сейчас работает, но мне кажется, что без JQuery Mobile в конфигурации по умолчанию

<!doctype html> 
    <html> 
    <head> 
     <meta charset="UTF-8"> 
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no"> 
    <title>Document</title> 
    <link rel="stylesheet" href="css/jquery.mobile-1.3.1.css"> 
    <link rel="stylesheet" href="css/estilo.css"> 
    <script src="js/cordova-2.6.0.js"></script> 
    <script src="js/jquery-2.0.0.js"></script> 
    <script src="js/custom-mobile.js"></script> 
    <script src="js/jquery.mobile-1.3.1.js"></script> 
    <script src="js/functions.js"></script> 

     </head> 
     <body> 
      <div data-role="page" id="page"> 
       <div data-role="header" position="fixed"> 
       <h1>Data</h1> 
       </div> 
       <div data-role="content">  
         <div id="btn_comentar"> 
         <a href="#page4"></a> 
         </div> 
        </div> 
      </div> 
     </body> 
     </html>

заказ mobile.js

$(document).bind("mobileinit", function(){ 
     //$.mobile.allowCrossDomainPages = true; 

     });

functions.js

$(document).on("ready",function(){ 
    $("#btn_comentar").bind("vclick",function(){ 
        list_comments(); 
       }); 
});

источник

2013-07-09 jagudel

Удалить привязку «mobileinit». Вы также можете удалить 'pageinit', просто сохраните привязку' vclick'. Используйте '.on' вместо' .bind'. – Omar

Человек положил весь ваш HTML-код и все, чтобы я мог видеть, как вы структурировали свои html и div внутри внутри – abdu

@Omar спасибо, но не работает – jagudel

использование сразу на pageinit:

$(document).on('pageinit') { 
$("#btn_comentar").on("vclick",function(e){ 

     console.log(e.isDefaultPrevented()); 
     console.log(e.result); 
     console.log(e.relatedTarget); 
     alert("buttooon"); 

      list_comments(); 

     }); 
}

это должно работать

источник

2013-07-09 22:59:07 Muath

Нет '.ready' с JQM. – Omar

@Omar Enta sa7, всегда Спасибо – Muath

hala garabti, kol saneh o enta salem :) – Omar

According to docs,

Эти усовершенствования применяются на основе конфигурации по умолчанию jQuery Mobile, которая предназначена для работы с общими сценариями, но может или не соответствовать вашим конкретным потребностям. К счастью, эти настройки легко настраиваются с помощью события mobileinit.

Так вот что вам нужно использовать mobileinit для. Для установки по умолчанию, как это:

$(document).bind('mobileinit', function(){ 
     $.mobile.defaultTransition = 'slideup'; 
});

Если мое понимание правильно, mobileinit включен/вызывается перед JS JQuery Mobile, включена. Предполагая, что вы сделали это, ваш заказ сценарий должен выглядеть следующим образом:

<script src="jquery.js"></script> 
<script src="custom-scripting.js"></script> <!-- This script must have mobileinit --> 
<script src="jquery-mobile.js"></script>

На данный момент времени (когда заказ scripting.js загружен), pageinit не были бы определены. Было бы разумно добавить ваше событие pageinitПОСЛЕ сценарий jQM.

<script src="jquery.js"></script> 
<script src="custom-scripting.js"></script> <!-- This script must have mobileinit --> 
<script src="jquery-mobile.js"></script> 
<script> 
    $(document).bind("pageinit", function(){ 
    $(document).bind("vclick", "#btn_comentar" ,function(e){ 
     console.log(e.isDefaultPrevented()); 
     console.log(e.result); 
     console.log(e.relatedTarget); 
     alert("buttooon"); 
     list_comments(); 
     }); 
    }); 
</script>

источник

2013-07-10 07:14:25 krishgopinath

спасибо за ваш интерес и помощь, я сделал то, что вы сказали, но безрезультатно, все еще с той же проблемой – jagudel

Я нашел решение, но я не знаю, было ли оно правильным, я внес некоторые изменения, как сказал @hungerpain, а вместо $ (document) .bind ("pageinit", function() {...}); Я использовал $ (document) .on ("ready", function() {...}); но, как сказал hungerpain, это не конфигурация по умолчанию jQuery Mobile. – jagudel

@jagudel вы могли бы разместить здесь свой код, чтобы мы могли это исправить? вы не spsd, чтобы использовать 'ready'. – krishgopinath

Другой причиной двойных vclicks я столкнулся из-за Chromium синтеза как сенсорные события в дополнение к событиям мыши. Я подтвердил эту причину, запустив приложение в режиме «устройства устройства» браузера Chrome (где курсор мыши изменяется в круг), подтверждая наличие проблемы, затем переключая режим устройства и подтверждая, что проблема «исправлена».

jblas discusses it, частичная выдержка:

Обратите внимание, что vclick не подавляет синтезированный мышь/клик события, которые генерируются в браузере, потому что он не знает, в каком контексте оно используется в, и образуют элементы ввода требуют, чтобы события мыши/клика функционировали нормально.

Если вы используете джойстик или мышь (рабочий стол), предупреждение будет запускаться при обычном событии щелчка мыши.

Если вы хотите отключить событие click при использовании touch, вам нужно вызвать event.preventDefault() в вашем обработчике vclick. Это вызовет очередь на запрос, чтобы убить событие click, которое следует, но из-за различий в способах реализации поставщиками устройств их событий и некоторых ошибок в разных версиях ОС Android это очень сложно сделать. Мы пробуем несколько методов, чтобы выяснить, убивать ли событие клика ... один из них основан на элементе, на котором было вызвано событие касания, а на другом - положение события касания. Это необходимо, потому что браузер не обязательно передает событиям мыши одному элементу, который он использовал для события touch.

источник

2016-04-26 08:49:33 Treer

jQuery Mobile vclick дважды запускается

ответ

Смежные вопросы