Question

我想实现一些目标，但令人惊讶的是无法在线找到任何代码。 jquery切换功能很棒，但我也希望将它与扩展div中的“关闭”按钮结合起来。这样你可以用一个外面的按钮打开它，但也有一个“关闭”按钮在里面关闭它。下面显示我尝试的没有成功：

$(document).ready(function(){

$("#country_slide").hide();
$("#country").show();

$('#country').click(function(){
$("#country_slide").slideToggle();
});
});

我想我需要一个内部按钮来做这样的事情：

$('#close').click(function() {
  $('#country_slide').hide('slow', function() {
  });
});

Answer 1

这是一个有效的版本：http://jsfiddle.net/uhEgG/2/ - Javascript是：

$(document).ready(function(){  
    $('#country').click(function () {
        $("#country_slide").slideToggle();
    });

    $('#close').click(function (e) {
        e.preventDefault();
        $('#country_slide').slideToggle();
    });
});

我更新了HTML：

<div id="country_slide">test<a href="#" id="close">Close</a></div>

Answer 2

在“#county_slide”

中创建一个按钮

$('#btnClose').click(function (e) {
    e.preventDefault();
    $('#country_slide').slideToggle();
});

Answer 3

您只需将slideUp用于关闭，将slideDown用于开启
检查fiddle

 $('#country').click(function () {
    $("#country_slide").slideDown();
});

$('#close').click(function () {
   $('#country_slide').slideUp();
});

Jquery结合使用关闭按钮切换

3 个答案: