admin管理员组

文章数量:1395744

I have a html structure. With the following:

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

And:

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

I want, when i click CHANGE, get user_adr div on front. Ajax or other solution. I tried jQuery .load function but it's not work. How can i do this?

Demo

I have a html structure. With the following:

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

And:

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

I want, when i click CHANGE, get user_adr div on front. Ajax or other solution. I tried jQuery .load function but it's not work. How can i do this?

Demo

  • javascript
  • jquery
  • ajax
  • load
Share edited Mar 1, 2013 at 9:55 Karmaa asked Mar 1, 2013 at 9:38 KarmaaKarmaa 6681 gold badge13 silver badges37 bronze badges 1
  • How do you "open" a div? – gdoron Commented Mar 1, 2013 at 9:40
Add a ment  | 

4 Answers 4

Reset to default 4

You can use toggle() function to show / hide html element.

Live Demo

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

alternatively you can use toggle functionality. 

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

if not toggle. then alternative method of toggle is this. 

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

//to change display to none 

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

you can use jquery ui. dialog() method to show a dialog box. like this. 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>

if in case there is any other div with same class name edit above solutions may not be helpful so better u keep a unique id as "change"

<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();
});

本文标签： javascriptOpen div when click a another divStack Overflow

版权声明：本文标题：javascript - Open div when click a another div - Stack Overflow 内容由网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://www.betaflare.com/web/1744650878a2617675.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。