what - jQuery click event not working in mobile browsers




what is jquery (4)

تقودني إجابة فوهومان إلى عملي الخاص:

$(document).on("vclick", ".className", function() {
  // Whatever you want to do
});

بدلا من:

$(document).ready(function($) {
  $('.className').click(function(){
    // Whatever you want to do
  });
});

آمل أن يساعد هذا!

https://code.i-harness.com

يبدو أن نقر jQuery click لا يطلق النار في متصفحات الجوال.

HTML على النحو التالي:

<!-- This is the main menu -->
<ul class="menu">
   <li><a href="/home/">HOME</a></li>
   <li class="publications">PUBLICATIONS &amp; PROJECTS</li>
   <li><a href="/about/">ABOUT</a></li>
   <li><a href="/blog/">BLOG</a></li>
   <li><a href="/contact/">CONTACT</a></li>
 </ul>


 <!-- This is the sub-menu that is to be fired on click -->
 <div id="filter_wrapper">
   <ul id="portfolioFilter">
      <li><a href="/nutrition-related/">Nutrition related</a></li>
      <li><a href="/essays/">Essays and Nonfiction</a></li>
      <li><a href="/commissioned/">Commissioned works</a></li>
      <li><a href="/plays/">Plays and performance</a></li>
      <li><a href="/new-projects/">New Projects</a></li>
    </ul>
  </div>

هذا هو برنامج jQuery النصي للجوال:

$(document).ready(function(){
   $('.publications').click(function() {
       $('#filter_wrapper').show();
   });
 });

عندما انقر فوق عنصر القائمة "المنشورات" على متصفح المحمول لا يحدث شيء.

يمكنك عرض الموقع هنا: http://www.ruthcrocker.com/

لست متأكدًا مما إذا كانت هناك أحداث خاصة بجوكر jQuery محددة.


رامينسون لديه إجابة لطيفة إذا كنت بالفعل (أو لا تمانع) باستخدام jQuery Mobile. إذا كنت تريد حلاً مختلفًا ، فلماذا لا تعدّل الشفرة فقط كما يلي:

تغيير ذلك LI كنت تواجه مشكلة مع تضمين علامة A وتطبيق الفصل هناك بدلا من LI

<!-- This is the main menu -->
<ul class="menu">
   <li><a href="/home/">HOME</a></li>
   <li><a href="#" class="publications">PUBLICATIONS &amp; PROJECTS</a></li>
   <li><a href="/about/">ABOUT</a></li>
   <li><a href="/blog/">BLOG</a></li>
   <li><a href="/contact/">CONTACT</a></li>
 </ul>

وجافا سكريبت / jquery الخاص بك ... العودة كاذبة لوقف الفقاعات.

$(document).ready(function(){
   $('.publications').click(function() {
       $('#filter_wrapper').show();
       return false;
   });
 });

يجب أن يعمل هذا على ما تحاول القيام به.

لاحظت أيضًا أن موقعك يفتح الروابط الأخرى في علامات تبويب / نوافذ جديدة ، هل هذا مقصود؟


أعلم أن هذا موضوع قديم ، ولكنني أجبت عن سؤال مماثل ، وعلى الرغم من أن إجابتي يمكن أن تساعد شخصًا آخر لأنه يغطي خيارات الحل الأخرى:

تعمل أحداث النقر بشكل مختلف قليلاً على الأجهزة التي تعمل باللمس. لا يوجد ماوس ، لذلك لا توجد نقابة من الناحية الفنية. وفقًا لهذه المقالة - http://www.quirksmode.org/blog/archives/2010/09/click_event_del.html - نظرًا لقيود الذاكرة ، يتم فقط محاكاة الأحداث النقر وإرسالها من عناصر الربط والإدخال. يمكن لأي عنصر آخر استخدام أحداث اللمس ، أو أن يكون لديك أحداث النقر التي تمت تهيئتها يدويًا عن طريق إضافة معالج إلى عنصر html الأولي ، على سبيل المثال ، لفرض الضغط على الأحداث في عناصر القائمة:

$('li').each(function(){
    this.onclick = function() {}
});

سيتم تشغيل النقرة الآن بواسطة li ، لذلك يمكن الاستماع إليها بواسطة jQuery.

في حالتك ، يمكنك فقط تغيير المستمع إلى عنصر الارتساء بشكل جيد للغاية بواسطة @ mason81 ، أو استخدام حدث لمسة على li:

$('.menu').on('touchstart', '.publications', function(){
    $('#filter_wrapper').show();
});

هنا هو كمان مع بعض التجارب - http://jsbin.com/ukalah/9/edit


JqueryMobile: هام - استخدم $(document).bind('pageinit') ، وليس $(document).ready() :

$(document).bind('pageinit', function(){
   $('.publications').vclick(function() {
       $('#filter_wrapper').show();
   });
});




mobile