HTML網格視圖和列表視圖

所以我想這取決於它的外觀是什麼按鈕，我點擊（網格視圖和列表視圖）.. 我做了一些研究，大部分的東西可以使用jQuery做我的內容改變。但我只想使用JavaScript。我的問題是：我應該使用哪些元素？我目前通過使用語義UI來構圖（如果這甚至是一個真正的單詞）我的應用程序。HTML網格視圖和列表視圖

我發現這個片段在這裏計算器http://jsfiddle.net/LJf9p/794/ 但我似乎不能讓它跑，我的意思是它運行但根據按一下按鈕，如果我把HTML它不改變外觀，我一定要多補充一些東東？它在小提琴上工作，但不是當我在本地瀏覽器上運行它時。感謝

$('button').click(function(e) { 
if ($(this).hasClass('grid')) { 
    $('#container ul').removeClass('list').addClass('grid'); 
} 
else if($(this).hasClass('list')) { 
    $('#container ul').removeClass('grid').addClass('list'); 
} 
});

來源

2014-12-05 Ziddorino

你爲什麼不使用按鈕，通過唯一的ID？ – 2014-12-05 06:59:17

如何使用我的按鈕調用此JavaScript代碼？謝謝。它的工作原理上撥弄someoen發佈，但是當我將它複製到我的文件夾++然後在瀏覽器中運行它不工作。該風格的作品壽只是沒有 – Ziddorino 2014-12-05 07:01:06

@Super哦，我做現在的工作行爲。我只是給按鈕一個onclick方法，給ul一個唯一的id，然後用document.getElementById（）。classname改變它的類。如果有人需要。感謝您的支持 – Ziddorino 2014-12-05 07:03:58

請加

http://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js 和 $（文件）。就緒（函數（）{}）;

它的工作原理

<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
<script> 
$(document).ready(function() { 
    $('button').click(function(e) { 
     if ($(this).hasClass('grid')) { 
      $('#container ul').removeClass('list').addClass('grid'); 
     } 
     else if($(this).hasClass('list')) { 
      $('#container ul').removeClass('grid').addClass('list'); 
     } 
    }); 
}); 
</script>

來源

2014-12-05 07:36:08 anujsoft

將在幾分鐘內嘗試。謝謝 – Ziddorino 2014-12-07 23:43:24

HTML網格視圖和列表視圖

回答

相關問題