2

当我按下代码上的按钮时，我想回到代码的开头，这样我就可以重新编写代码。例如，如果我在 html 中有这个：

<div id='a'></div>
<div id='b'></div>
<div id='c'></div>
<div id='d'></div>

然后jquery看起来像这样

 $(document).ready(function(){
    $('#a').click(function(){
      $('#a').hide();
      $('#b').toggle(400)
      $('#c').css('margin', '100px)
    });
 });

在用户点击a后，我怎么能得到它，ab和c消失了，但是在他们点击d后ab和c又出现了重新做一遍

4

6 回答 6

1

也许你可以使用这个功能：

$('#d').click(function(){
  $('#a').show();
  $('#b').toggle(400)
  $('#c').css('margin', '0px)
});

我希望这可以帮助你。

于 2013-05-29T17:30:03.297 回答
0

I went with the following: http://jsfiddle.net/e57F9/1/

<div class="foo">
    <div id='a'>a</div>
    <div id='b'>b</div>
    <div id='c'>c</div>
    <div id='d'>d</div>
</div>

The use this to reset

// Make an original copy just in case they click 'd' first
var originalHtml = $(".foo").clone();
var clearCount = 0;
$(document).on("click", "#a", function(){
  // Backup the state right before clicking
  originalHtml = $(".foo").clone();
  $("#a").hide();
  $("#b").toggle(400);
  $("#c").css("margin", "100px");
});
$(document).on("click", "#d", function () {
  // Restore the object
  $(".foo").replaceWith(originalHtml.clone());
  clearCount++;
});
于 2013-05-29T17:45:47.990 回答
0

试试这个代码这里是演示

<div class="toHide" id="a">a</div>
<div class="toHide">b</div>
<div class="toHide">c</div>
<div id="d">d</div>


 $(document).ready(function(){
    $('#a').click(function(){
      $(".toHide").hide();
    });
     $('#d').click(function(){
      $(".toHide").show();
    });
 });
于 2013-05-29T17:30:40.133 回答
0

这个怎么样：

$('#d').click(function(){
  $('#a').show();
  $('#b').show();
  $('#c').css('margin', '0');
});

您还可以使用数据 API 保存初始状态（通过循环它们）：

 $("#a").data("original-state", $("<div></div>").html($("#a").clone())).html());

然后用以下方法恢复它：

$("#a").replaceWith($("#a").data("original-state"));
于 2013-05-29T17:31:58.390 回答
0

有很多方法可以做到这一点。但是，如果您希望显示 id="d"，您只需向其添加类“按钮”即可。永远记住为这种技术使用类。

<div id='a' class="button"></div>
<div id='b' class="button"></div>
<div id='c' class="button"></div>
<div id='d' class="reset"></div>

和 jQuery 将是

$(".button").click(function(){
  $(".button").not(this).hide("slow");
});
$("#d").click(function(){
  $(".button").show("slow");
});
于 2013-05-29T17:34:18.713 回答
0

我首先会使用 on 而不是 click （否则它不适用于我的方法）。

我也想保存一个“模板”。所以 DOM 就绪代码看起来像这样：

var template;
$(document).ready(function(){
    template = $('body').html();
    $(document).on('click', '#a', function(){
      $('#a').hide();
      $('#b').toggle(400)
      $('#c').css('margin', '100px)
    });
});

我会添加该事件：

$(document).on('click', '#d', function(){
    $('body').html(template)
})

更改$('body')按钮的父容器。

于 2013-05-29T17:33:55.967 回答