Question

$("ol").append("<div id='save' style='display:none'>Save<div>");
$("li").mouseup(function() {
   $('#save').show();
});
$("ol").sortable();
$("body").on('click','#save',function(){
    $(this).hide();
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js'></script>
<ol id='some123'>Items
  <li draggable='true'>Item 1</li>
  <li draggable='true'>Item 2</li>
  <li draggable='true'>Item 3</li>
  <li draggable='true'>Item 4</li>
</ol>

上面的

片段可与js append一起正常使用。在使用mouseup通过php追加后如何显示元素？

所以，我有可拖动的列表。而且，每次用户更改列表顺序时，我都需要显示元素。每次删除元素时，我都会调用一个函数，如下所示：

$("li").mouseup(function() {
   $('#save').show();
});
$("ol").sortable();

当用户单击“保存”按钮时，我使用以下方法将其隐藏：

$("body").on('click','#save',function(){
    $(this).hide();
})

但是如何再次显示它？ $('#save').show();无法正常工作！

最有趣的事情：我的php生成2个按钮，像这样：

<div class="buttons"><button id="saveTit" style="display: none" >Save content</button></div>

<div class="buttons"><button class="butClick" data-con='<?php echo $content?>'>Add new row</button></div>

要呼叫第二个按钮，我使用：

$(".butClick").on('click',function(){
      alert($(this).attr('data-tit'));
})

但是要打电话给第一名，我必须使用主体选择器...为什么知道？！

我在div中更改类的ID并调用一个事件... 而且有效...

Answer 1

您好，尝试将div更改为hidden，并使用prop函数代替show and hide：

$("ol").append("<div id='save' hidden>Save<div>");
$("li").mouseup(function() {
   $('#save').prop("hidden",false);
});
$("ol").sortable();
$("body").on('click','#save',function(){
    $(this).prop("hidden",true);
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js'></script>
<ol id='some123'>Items
  <li draggable='true'>Item 1</li>
  <li draggable='true'>Item 2</li>
  <li draggable='true'>Item 3</li>
  <li draggable='true'>Item 4</li>
</ol>

希望有帮助

追加后隐藏/显示元素

1 个答案: