2017-11-18 36 views
0

我試圖用秀()同時顯示的<img><a>如何使用jquery顯示多個div?

目前它只會顯示一個或另一個,取其最後調用。在下面的代碼中,它將是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; 
     } 

    }) 
+0

看起來你正在設置.showimagediv'的'了'innerHTML',然後顯示/隱藏'.showimagediv'。嘗試分割陳述。首先,設置'.showimagediv'的'html()',然後'show()'或'hide()''img'或'div'。 – KarthaCoder

回答

1

您可以使用display:none添加或刪除css類來顯示您的div。這非常簡單而且是一個好方法。

CSS:.hide{display:none;}

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

這使我朝着正確的方向前進。謝謝! – onlineoctopus