简体   繁体   中英

JQuery - Multiple show / hide div with external link

I have this code http://jsfiddle.net/s2CtY/16/ which works perfectly. However what l need is for

1.The click to show the DIV plus open an external link 2. To allow multiples of this via PHP

Can anyone help ?

$(document).ready(function () {
    $('.sub-nav ul').css("display","none");
    // Watch for clicks on the "slide" link.
    $('.sub-nav-btn').click(function () {
        $(this).next(".sub-nav ul").slideToggle(400);
        $(this).slideToggle(400);
        return false;
    });
    $('.sub-nav').on('click', 'ul', function () {
        $(this).prev(".sub-nav-btn").slideToggle(400);
        $(this).slideToggle(400);
        return false;
    });
});

HTML

<div class="sub-nav">
 <div class="sub-nav-btn"><a href="http://www.yahoo.com">btn1</a></div>
  <ul>btn1 slide data
  </ul>
</div>
<div class="sub-nav">
 <div class="sub-nav-btn">btn2</div>
  <ul>btn2 data slide
  </ul>
</div>

You should be able to accomplish this using window.open(); Capture the links URL into a var and pass that var to window.open() like so:

$(document).ready(function () {
        $('.sub-nav ul').css("display","none");
        // Watch for clicks on the "slide" link.
        $('.sub-nav-btn').click(function () {
            var url = $(this).children('a').attr('href');
            if(url != null){
                window.open(url);
            }
            $(this).next(".sub-nav ul").slideToggle(400);
            $(this).slideToggle(400);
            return false;
        });
        $('.sub-nav').on('click', 'ul', function () {
            $(this).prev(".sub-nav-btn").slideToggle(400);
            $(this).slideToggle(400);
            return false;
        });
    });

DEMO Hope this helps!

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM