点击

时间:2017-05-29 16:14:28

标签: javascript jquery

试图交换2个div。单击按钮#profeditclick1时,#profswitch1应与#subedit1交换。在单击按钮的那一刻,所有div都消失了。感谢您的帮助或指导。

HTML:

<div class="cart_verwrap" >

    <div class="cart_verbill" *id="profswitch1">

    <div class="btn blue cartprof-btn l-btn txt_fff s16" id="profeditclick1">Edit</div>
    </div>


    <!-- hidden edit profile in css it set to display:none-->
                   <div class="cart_verbill" id="hideedit1">


        </div>

jQuery的:

 $("#profeditclick1").click(function(e) {
        e.preventDefault();
        var content = $(this).html();
        $('#profswitch1').replaceWith('<div id="hideedit1">' + content + '</div>');
      });

更新

下一次尝试虽然似乎不起作用。我已经采用了display:none并试图隐藏它:

$("#hideedit1").hide();
$("#profeditclick1").click(function(e) {
    e.preventDefault();
    var content = $(this).html();
    $('#profswitch1').replaceWith('<div id="hideedit1">' + content + '</div>');
    $("#hideedit1").show();
});

1 个答案:

答案 0 :(得分:0)

我认为这可能会对你有所帮助。我在你的HTML中添加了一些修改。 请检查并根据需要进行更改。

    jQuery('#hideedit1').hide();
    jQuery('#profeditclick1').click(function(){
      jQuery(this).hide();
      jQuery('#hideedit1').show();
    });
    
      
    jQuery('#hideedit1 #save_edit').click(function(){
      jQuery('#hideedit1').hide();
      jQuery('#profeditclick1').show();
    });
    
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
    
    <div class="cart_verwrap" >
        <div class="cart_verbill">
            <div class="btn blue cartprof-btn l-btn txt_fff s16" id="profeditclick1">Edit</div>
        </div>
        <!-- hidden edit profile in css it set to display:none-->
         <div class="cart_verbill" id="hideedit1">   EDIT PROFILE CONTENT  <button id="save_edit">Save</button>  </div>
    </div>