如何在jQuery的

切換我想點擊一個按鈕（或在我的例子下面鏈接）和內容的2塊之間的切換基本上從顯示的內容編輯內容去。如何在jQuery的

我有下面的代碼snipits：

<style type="text/css"> 
    div.show {display:block;} 
    input.hide {display:none;} 
</style> 

<a href="#">edit</a> <!--not sure what my jquery should look like to do toggling--> 
<div class="show" id="d-01-on">Some content</div> 
<input class="hide" id="d-01-off" name="d-01" value="Some content" />

感謝您的幫助。

[見How to Streamline and Compress Repetitive jQuery Code，用於擴展到這個己技巧]

來源

2012-10-31 H. Ferrence

這是很容易與jQuery只需添加下面的JS代碼：

$(document).ready(function(){ 
    $('#button').on('click', function() { 
     $('#d-01-on').toggle(); 
     $('#d-01-off').toggle(); 
    }); 
})

它將與您當前的標記和CSS代碼工作。

來源

2012-10-31 12:52:18 Skatox

優秀@Skatox。完美的作品。謝謝！ –

如果你有一個@Skatox你能看看我的後續問題在http://stackoverflow.com/questions/13159735/how-to-toggle-within-a-content-list-in-jquery？謝謝。 –

我很高興它的工作，會檢查一會兒。 – Skatox

顯示和隱藏使用jquery一個元件被如下進行：

HTML：

<div id="d-01">content</div>

使用Javascript：

$.("#d-01").toggle(); //toggles display so if shown then hides, if hidden then shows; 
$.("#d-01").show(); //shows div 
$.("#d-01").hide(); //hides div

來源

2012-10-31 12:49:06

此外，要從超鏈接中觸發此操作，請將jquery代碼包裝到函數定義中，然後爲您的標記指定一個onclick屬性，並將該函數的名稱作爲其參數 –

很酷，謝謝@mr_lewjam ...現在就試試。我會在一會兒回覆。 –

謝謝@mr_lewjam。我一直在努力，直到我看到下面的Skatox的建議。然後我嘗試了那個，並且讓它工作起來非常快。所以我打算把斯卡托克斯作爲答案，但是我真的很感謝你的建議，我相信我可以更加努力地工作。 –

這將切換兩個元素的可見性：

function handleClick() { 
    $('div.show').toggle(); 
    $('input.hide').toggle(); 
}

那麼當然你的班名是錯的。您可以改用ID。

來源

2012-10-31 12:50:55

謝謝@ChrisMiller的建議。我正在與Skatox一起進行下面的練習，因爲我真的很快運行了它。 –

如何在jQuery的

回答

相關問題