如何用新数据刷新/重新加载/更新手风琴数据？

Question

有人能告诉我，当用户输入输入时，如何在单击按钮时使用新值更新手风琴数据？

假设有输入框。用户在给出值后点击提交。同时它应该显示用户在手风琴中输入的内容。

手风琴将被归类为

/Latest update
/old updates
/etc

什么是

$("className").click(function(){ 
setInterval(function(){                 
            }, 900);    
    })
    <div classname="className"></div>

如果为 Typescript、Jquery 甚至 Angular2 共享 fiddle/plunker sn-ps 会更好

非常感谢您的帮助

Answer 1

因为我有一些空闲时间，所以我给你做了一个我认为你想要的例子。

1.输入'aa' latest updates 将向下滑动并显示文本'aa'

2.输入第二个值 'bb'，latest updates 将有文本 'bb' ，old updates 将有文本 'aa' 并且 'aa' 已存档

3.输入第三个值'cc'，latest updates 将有文本'cc'，old updates 将有文本'bb'，存档将有'aa' 和'bb'

等等。

这是使用 IF 条件进行的，使用 text().length 非常简单。

还包括（在 JQ 开头）一个简单的手风琴代码

如果这就是您要找的，请告诉我。检查下面的sn-p或jsFiddle

var accTrigger = $('h2')
$(".text").hide()
$("h2").on("click", function() {
  var text = $(this).siblings(".text")
  if ($(text).is(":visible")) {
    $(text).slideUp()
  } else {
    $(text).slideDown()
  }
  $(this).parents(".accordion-item").siblings().find(".text").slideUp()
});


var button = $("button"),
  input = $("input"),
  latest = $("#latest .text"),
  old = $("#old .text"),
  archive = $("#archive .text")



$(button).on("click", function() {
  inputValue = $(input).val()

  if ($(latest).text().length > 0) {
    $(old).text($(latest).text()).slideDown()

  }
  if ($(old).text().length > 0) {
    var aText = $(archive).html()
    $(archive).html(aText + '<br>' + $(old).text()).slideDown()
  }
  $(latest).text(inputValue).slideDown()


})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="accordion">
  <div class="accordion-item" id="latest">
    <h2>Latest Updates</h2>
    <div class="text"></div>
  </div>
  <div class="accordion-item" id="old">
    <h2>Old Updates</h2>
    <div class="text"></div>
  </div>
  <div class="accordion-item" id="archive">
    <h2>Archive</h2>
    <div class="text"></div>
  </div>
</div>

<input type="text" value="">
<button type="submit">
  submit value
</button>