2013-03-01 162 views
1

我有一個html結構。用下面的:打開div時,點擊另一個div

<div class="edit"><a class="formtri" href="#">CHANGE</a> 

和:

<div id="user_adr" style="display:none"> 

我想,當我點擊CHANGE,得到前user_adr格。 Ajax或其他解決方案。我試過jQuery .load函數,但它不工作。我怎樣才能做到這一點?

Demo

+0

你怎麼」打開「一個div? – gdoron 2013-03-01 09:40:51

回答

1

或者你可以使用切換功能。

$('.edit').on('click',function(){ 
    $('#user_adr').toggle(); 
}); 

如果不切換。那麼切換的另一種方法是這樣的。

$('.edit').on('click',function(){ 
if('#user_adr').is('visible')) 
    { 
     $('#user_adr').show(); 
    } 
    else 
    { 
     $('#user_adr').hide(); 
    } 
}); 

//改變顯示爲無

$('#yourDivId).attr('display','none'); 
+0

不工作...... http://jsfiddle.net/A3uMP/ – Karmacoma 2013-03-01 09:54:21

+0

@ user1213807你需要包括jquery庫http://jsfiddle.net/A3uMP/1/ – 2013-03-01 09:59:14

+0

好吧,但是當得到user_adr div,我想顯示:沒有改變divs。 – Karmacoma 2013-03-01 10:02:13

1

可以使用jquery ui. dialog()方法來顯示一個對話框。喜歡這個。 Jquery dialog

<script> 
    $(function() { 
    $("#dialog").dialog({ 
     autoOpen: false, 
     show: { 
     effect: "blind", 
     duration: 1000 
     }, 
     hide: { 
     effect: "explode", 
     duration: 1000 
     } 
    }); 

    $("#opener").click(function() { 
     $("#dialog").dialog("open"); 
    }); 
    }); 
    </script> 
</head> 
<body> 

<div id="dialog" title="Basic dialog"> 
    <p>This is an animated dialog which is useful for displaying information. The dialog window can be moved, resized and closed with the 'x' icon.</p> 
</div> 

<button id="opener">Open Dialog</button> 
4

可以使用toggle()函數來顯示/隱藏HTML元素。

Live Demo

$('.edit').click(function(){ 
    $('#user_adr').toggle(); 
}); 
0

如果萬一有任何其他分區與上述解決方案相同的類名編輯可能沒有幫助,以便更好地ü保持一個唯一的ID爲「變化「

<div class="edit"><a class="formtri" id="change" href="#">CHANGE</a> 

$("#change").on("click", function(){ 
$('#user_adr').show(); 
});  

$("#change").on("click", function(){ 
$('#user_adr').toggle(); 
});