当我单击按钮时,页面正在上升

时间:2015-08-17 14:03:47

标签: jquery html css

我需要帮助。我正在努力找到解决问题的方法。当我点击按钮时,页面会上升,但我不想要这个。点击后页面必须保留。以下是我的代码;

<section class="category">
  <h1 class="uppercase">OTURMA ODASI</h1>
  <ul class="ad-list sub">
    <li>
      <div class="drop">
        <a href="#" class="subMenuOpener">
          <img src="images/content/icon/tire.svg" alt="img-description" height="48" width="48"><span>OTURMA GRUPLARI</span>
        </a>
        <ul style="display: block;" class="sub-ul">
          <li class="sub-li">
            <a href="oturma-odasi-mobilyalari/oturma-gruplari-takimlari/koltuk-takimlari-mobilyalari.html">
              <img src="images/content/icon/oturma_koltuk_takimlari.svg" alt="img-description" height="48" width="48"><span class="no-content">KOLTUK TAKIMLARI</span>
            </a>
          </li>
          <li class="sub-li">
            <a href="oturma-odasi-mobilyalari/oturma-gruplari-takimlari/kose-koltuklar-mobilyalar.html">
              <img src="images/content/icon/oturma_kose_koltuklar.svg" alt="img-description" height="48" width="48"><span class="no-content">KÖŞE KOLTUKLAR</span>
            </a>
          </li>
        </ul>
      </div>
    </li>
    <li>
      <div class="drop">
        <a href="#" class="subMenuOpener">
          <img src="images/content/icon/tire.svg" alt="img-description" height="48" width="48"><span>SEHPALAR</span>
        </a>
        <ul style="display: block;" class="sub-ul">
          <li class="sub-li">
            <a href="oturma-odasi-mobilyalari/orta-zigon-yan-sehpalar-mobilyalar/zigon-sehpa.html">
              <img src="images/content/icon/sehpazigon.svg" alt="img-description" height="48" width="48"><span class="no-content">ZİGON SEHPA</span>
            </a>
          </li>
          <li class="sub-li">
            <a href="oturma-odasi-mobilyalari/orta-zigon-yan-sehpalar-mobilyalar/yan-sehpa.html">
              <img src="images/content/icon/sehpalar_yan_sehpa.svg" alt="img-description" height="48" width="48"><span class="no-content">YAN SEHPA</span>
            </a>
          </li>
        </ul>
      </div>
    </li>
    <li>
    </li>
  </ul>
</section>

感谢您的一切

2 个答案:

答案 0 :(得分:2)

而不是<a href="#" ....之类的内容使用<a href="javascript:void(1);" ....

#与有效的基础href结合使用会产生不必要的滚动效果。

答案 1 :(得分:0)

您标记了jquery,因此您必须阻止默认值。请参阅以下方法:

$('section.category ul li a').on('click', function(e)
{
   e.preventDefault(); // prevent normal link action

   // do your alternative logic
});

可靠的文档:http://api.jquery.com/event.preventdefault/