如何点击一下 - 点击嵌套的li元素后

时间:2016-03-27 20:29:33

标签: javascript jquery

我有识别点击li元素的问题,她是html结构:

<section class="right_menu" id="right_menu">
<div class="menu_pusher">

   <ul id="0">
    <li><a href="#">Product_1</a></li>
    <li><a href="#">Product_2</a></li>
    <li><a href="#">Product_3</a></li>
    <li><a href="#">Product_4</a></li>
    <li class="Product_5"><a href="#">Product_5</a>
      <ul>
        <li class="Article_1"><a href="#">Article_1</a>
          <ul>
            <li><a href="#">Detail_1</a></li>
            <li><a href="#">Detail_2</a></li>
            <li><a href="#">Detail_3</a></li>
          </ul>
        </li>
        <li><a href="#">Article_2</a></li>
        <li><a href="#">Article_3</a></li>
        <li><a href="#">Article_4</a></li>
      </ul>
    </li>
    <li><a href="#">Product_4</a></li>
  </ul>

</div>
</section>

所以,当我点击Product_5警报时,给我Product_5,所以没关系,但是当我clikc然后在Article_1警报给我Article_1然后Product_5 agein,它看起来像双击,但我现在不行。

这是javascript代码:

    function has_ul(element){
    if((element.getElementsByTagName('li').length >= 1))
        return true;
    else
        return false;
}

$(document).ready(function()
{   $('#right_menu .menu_pusher ul li').on('click',rout);})

var timeout      = 500;
var closetimer      = 0;
var ddmenuitem    = 0,
open = false;

function rout(){open?jsddm_close():jsddm_open(this);}

function jsddm_open(el)
{   
//open=true;
jsddm_canceltimer();

    if(has_ul(el)){
        var lef = parseInt($('.menu_pusher').css("left")) - 220;
        alert(el.className);
        $('.menu_pusher').css('left', lef);
        return false;
    }
}

function jsddm_close()
{   

if(ddmenuitem) ddmenuitem.css('display', 'none');
open=false;}

function jsddm_timer()
{   closetimer = window.setTimeout(jsddm_close, timeout);}

function jsddm_canceltimer()
{   if(closetimer)
    {   window.clearTimeout(closetimer);
        closetimer = null;}}

所以我得到li元素点击?以下是此示例的链接:

Live Example

1 个答案:

答案 0 :(得分:0)

尝试在元素上处理事件而不是li ...这应该避免出现这种双重事件行为。