javascript - 如何在页面加载时隐藏门户页面上的按钮并在稍后单击其他按钮时显示它

Question

我对 CRM 和门户网站很陌生。

我想知道如何在页面加载时隐藏门户页面上的按钮，并在稍后单击其他按钮时显示它。

我在我的实体列表上创建了这些按钮，因为我在门户上显示来自实体的视图。

Answer 1

您可以在这种情况下使用 css、javascript 或 jquery，例如此代码可能会对您有所帮助。我将按钮设置为延迟 3 秒后缓慢出现。

setTimeout(function(){
var x = document.querySelector('.hidden-btn');
x.style.WebkitTransition = "all 2s" // for safari.
x.style.transition = "all 2s"; // for chrome.
x.style.opacity = 1; // you can either use opacity or block
}, 3000); // 3000 is equivalent for 3 seconds

.hidden-btn{opacity: 0;} /* you can either use opacity or display: none here */

<button class="hidden-btn">Hidden Button</button>

Answer 2

当单击另一个按钮时，我只会使用 jQuery 来显示最初隐藏的按钮。使用 css 从一开始就设置为隐藏，然后在需要时使用 jquery .show() 函数显示它。

.show() 函数中的数字是显示按钮的速度。1000 = 1 秒。如果您希望它立即显示，只需取出数字即可。

祝你好运。

$(document).ready(function() {

// show the hidden button when another button is clicked.
  $("body").on("click", ".showHiddenButton", function() {
    $("#hiddenButton").show(1000);
  });

});

#hiddenButton {
  display: none;
  background: orange;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<button id="hiddenButton">INITALLY HIDDEN BUTTON</button>

<button class="showHiddenButton">Show Hidden Button</button>