使用 jQuery 显示带有超链接的 Div

Reveal Div with Hyperlink using jQuery

本文关键字:超链接 Div jQuery 显示 使用      更新时间:2023-09-26

我有一个jQuery面板,点击按钮时会打开。

但是,我想要页面底部的第二个链接,该链接打开相同的面板。

我如何实现这一点?

这是我的JSFiddle和Javascript:

$(document).ready(function() {
    // Expand Panel
    $("#open").click(function(){
        $("div#panel").slideDown("slow");   
        $("#open").addClass("hidden");
         $("#close").removeClass("hidden");
    });     
    // Switch visiblility of the "Close Panel" button
    $("#close").click(function () {
        $("div#panel").slideUp("slow"); 
        $("#close").addClass("hidden");
        $("#open").removeClass("hidden");
    });
    });

非常感谢您的任何指导。

它可能

很简单,但是如果您触发按钮的单击事件,它应该会产生您需要实现的效果。

$("#myLink").click(function(){
    $("#open").click();
    });

这是更新的小提琴:http://jsfiddle.net/4dkoke6w/2/

如果这不是您想要的,请告诉我,我可以根据您的要求对其进行一些调整。

扩展选择器:

// Expand Panel
$("#open, #link").click(function(){
    $("div#panel").slideDown("slow");   
    $("#open").addClass("hidden");
    $("#close").removeClass("hidden");
});     

像这样:

$(document).ready(function() {
function showPanel(){
 $("div#panel").slideDown("slow");   
        $("#open").addClass("hidden");
         $("#close").removeClass("hidden");
}
// Expand Panel
$("#open,#second-button-you-talked-about").click(showPanel); 
//or    
$("#open").click(showPanel);
$("#second-button-you-talked-about").click(showPanel);
// Switch visiblility of the "Close Panel" button
$("#close").click(function () {
    $("div#panel").slideUp("slow"); 
    $("#close").addClass("hidden");
    $("#open").removeClass("hidden");
});
});

(你还应该将jQuery元素存储在变量中(

使用class而不是id

$(".opendivs").click(function(){
    $("div#panel").slideDown("slow");   
    $("#open").addClass("hidden");
     $("#close").removeClass("hidden");
}); 

类 Opendiv 提供给您要用来打开div 的所有链接