问题：当其中的任务完成时，当前的 div 消失

Question

这是我的 HTML：<form action="index.php" method='post'><div class="task-btn">    <button class="task-info" name="update-animal" onclick="show('update')">Update</button>    <button class="task-info" name="add-animal" onclick="show('add')">Add</button>    <button class="task-info" name="dlt-animal" onclick="show('delete')">delete</button></div><?php if($template == 1): ?>    <div id="update">    </div><?php endif; ?><?php if($template == 2): ?>    <div id="add">    </div><?php endif; ?><?php if($template == 3): ?>    <div id="delete">    </div><?php endif; ?>这是我的PHP：$template = 0;if (isset($_POST['update-animal'])) {$template = 1;}if (isset($_POST['add-animal'])) {$template = 2;}if (isset($_POST['dlt-animal'])) {$template = 3;}这是我的 Javascript： var update = document.getElementById('update');var add = document.getElementById('add');var dlt = document.getElementById('delete');function show(element) {    if(element == 'update'){        update.style.display = 'block';        add.style.display = 'none';        dlt.style.display = 'none';    }    else if(element == 'add'){        add.style.display = 'block';        update.style.display = 'none';        dlt.style.display = 'none';    }    else if(element == 'delete'){        dlt.style.display = 'block';        update.style.display = 'none';        add.style.display = 'none';    }}我想要的是单击任务按钮并显示相应的模板。问题是当我更新/添加/删除我的数据库中的一些数据时，它会刷新页面，因此它只会显示三个按钮而不是你所在的 div 的内容。如果您需要 add div 的 php 来查看发生了什么，请告诉我我会发送它。

Answer 1

好的，明白你的问题了。您不想在任务完成后刷新页面。所以在onclick函数名前添加return。该函数应该向 onclick 返回 false。这意味着在 HTML 部分用这个改变你的按钮部分代码：

<button class="task-info" name="update-animal" onclick="return show('update')">Update</button>

<button class="task-info" name="add-animal" onclick="return show('add')">Add</button>

<button class="task-info" name="dlt-animal" onclick="return show('delete')">delete</button>

然后在 javascript 函数中添加return false;这样的函数结尾：

function show(element) {

 if(element == 'update'){

        update.style.display = 'block';

        add.style.display = 'none';

        dlt.style.display = 'none';

    }

    else if(element == 'add'){

        add.style.display = 'block';

        update.style.display = 'none';

        dlt.style.display = 'none';

    }

    else if(element == 'delete'){

        dlt.style.display = 'block';

        update.style.display = 'none';

        add.style.display = 'none';

    }

return false;

}