2013-12-21 3 views
0

У меня есть ссылки, прикрепленные к jquery, и когда я нажимаю ссылки, страница прокручивается назад.Предотвращение прокрутки веб-страницы при нажатии на ссылку

Как я могу предотвратить это. В поле fiddle вы можете увидеть, если вы прокрутите страницу вниз до отметки 7 и щелкните по ней, она переместится вверх.

Пожалуйста, помогите.

HTML:

<ul class="leftlist"> 
        <li itemage="" id="1013" class="todo"><a href="#" class="strike">   
        <span class="cb check_box"></span> 

     <p>Check One</p></a>   
        </li><li itemage="" id="1014" class="todo"><a href="#" class="strike">   
        <span class="cb check_box"></span> 

     <p>Check two</p></a>   
        </li><li itemage="" id="1018" class="todo"><a href="#">   
        <span class="uncheck_box cb"></span> 

     <p>Check 3</p></a>   
        </li><li itemage="" id="1019" class="todo"><a href="#">   
        <span class="uncheck_box cb"></span> 

     <p>Check 4</p></a>   
        </li><li itemage="" id="1024" class="todo"><a href="#">   
        <span class="uncheck_box cb"></span> 

     <p>Check 5</p></a>   
        </li><li itemage="1" id="1021" class="todo"><a href="#">   
        <span class="uncheck_box cb"></span> 

     <p>Check 6</p></a>   
        </li><li itemage="3" id="1025" class="todo"><a href="#">   
        <span class="uncheck_box cb"></span> 

     <p>Check 7</p></a>   

     </li></ul> 

JAVASCRIPT:

(function($){ 
     $('li.todo').click(function(){ 
      if($(this).find('.uncheck_box').length >0){ 
       var _t=$(this).find('.uncheck_box'); 
       _t.removeClass('uncheck_box'); 
       _t.addClass('check_box'); 
       m_val='1'; 
       $(this).find('a').addClass('strike'); 
      }else{ 
       m_val='0'; 
       var _t=$(this).find('.check_box'); 
       _t.removeClass('check_box'); 
       _t.addClass('uncheck_box'); 
       $(this).find('a').removeClass('strike'); 
      } 
     var m_key=jQuery(this).attr('id'); 
      jQuery.ajax({ 
       type: "POST", 
       url: "<?php echo get_template_directory_uri(); ?>/ajax_get.php", 
       data: { meta_key: m_key, meta_value: m_val}, 
       beforeSend: function( ) { 
       //jQuery(this).attr("disabled", true);  
       }, 
       success:function(){} 
      }) 
     }); 



    $('.sort').click(function(){ 
     var _t=$(this); 
     $('.sort').removeClass('active'); 
     $(this).addClass('active'); 
     if(_t.hasClass('showall')){ 
      $('li.todo').show(); 
     }else if(_t.hasClass('complete')){ 
      $('li.todo').show(); 
      $('li.todo').filter(function(){ 
       return !!$(this).find('span.uncheck_box').length; 
      }).hide(); 
     }else if(_t.hasClass('incomplete')){ 
      $('li.todo').show(); 
      $('li.todo').filter(function(){ 
       return !!$(this).find('span.check_box').length; 
      }).hide(); 
     } 

    }); 


    jQuery(document).ready(function(){ 
     jQuery('.chkbx').click(function(){ 

     var cuser_id='<?php echo $current_user->ID;?>'; 
     var m_val='0'; 
     if(jQuery(this).is(':checked')) 
     { 
      m_val='1'; 
      jQuery(this).parent().next("dd").addClass('strike'); 
     }else 
     { 
      m_val='0'; 
      jQuery(this).parent().next("dd").removeClass('strike'); 
     } 
     var m_key=jQuery(this).attr('id'); 
      jQuery.ajax({ 
       type: "POST", 
       url: "<?php echo get_template_directory_uri(); ?>/ajax_get/", 
       data: { meta_key: m_key, meta_value: m_val}, 
       beforeSend: function( ) { 
       jQuery(this).attr("disabled", true);   } 
      }) 
       .done(function(msg) { 
       jQuery(this).attr("disabled", false);  
       }); 
     }); 
    }); 

ответ

1

Вы можете использовать этот

<a href="javascript:;">Your content</a> 
+0

Спасибо, что сработало отлично – user2798091

2

Это вызвано # в <a href="#"> заменить это <a href="javascript:void(0);">

http://jsfiddle.net/8dF28/2/

+0

это не работает, так как оно приводит к другой странице «не найден» – user2798091

+0

Прокрутка вызвана '#', потому что она ссылается на верх. Используя 'void (0);' он ничего не делает. Навигация должна быть вызвана Javascript. Как вы можете видеть в Fiddle, он не прокручивается с помощью 'void (0);' –

+0

убедитесь, что вы добавили 'javascript:' перед 'void (0);' –

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