gpt4 book ai didi

javascript - 如何用jquery显示多个div?

转载 作者:行者123 更新时间:2023-12-01 02:44:15 28 4
gpt4 key购买 nike

我正在尝试使用 show() 来显示 <img>和一个 <a>

目前它只会显示其中一个,以最后调用的为准。在下面的代码中,它将是 html(img).show()因为它是在之后。做$('.showimagediv').html(div,img).show();具有相同的效果。尝试将两个语句合并为一个变量:

var img = ($('<a />', {href    : this.getAttribute("data-permaLink"), 'class': 'permaLinkDiv'}),$('<img />', {src    : this.getAttribute("data-url"), 'class': 'fullScreenimg'}));

只会产生<img>出现。有谁知道如何同时显示两者?

  var imgToggle=false;
$('.box').on('click', function() {
var img = $('<img />', {src : this.getAttribute("data-url"), 'class': 'fullScreenimg'});
var div = $('<a />', {href : this.getAttribute("data-permaLink"), 'class': 'permaLinkDiv'});
if(imgToggle==true){
$('.showimagediv').html(img).hide();
imgToggle=false;
}
if(imgToggle==false){
$('.showimagediv').html(div).show();
$('.showimagediv').html(img).show();

imgToggle=true;
}

})
$('.showimagediv').on('click', function() {
var img = $('<img />', {src : this.getAttribute("data-url"), 'class': 'fullScreenimg'});
var div = $('<a />', {href : this.getAttribute("data-permaLink"), 'class': 'permaLinkDiv'});
if(imgToggle==true){
$('.showimagediv').html(img).hide();
divToggle=false;
}

})

最佳答案

您可以使用 display:none 添加或删除 css 类来显示您的 div。这是非常简单且很好的方法。

示例 CSS: .hide{display:none;}

$('div').add('img').addClass('hide');  //or 
$('div').add('img').removeClass('hide');

关于javascript - 如何用jquery显示多个div?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47362702/

28 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com