.show(）和.hide(）在jquery中是如何工作的

How .show() and .hide() work in jquery

本文关键字：何工作 工作 jquery hide show      更新时间：2023-09-26

我目前正在注册，根据注册过程中的位置，我会隐藏和显示不同的输入。目前，我有4个输入，我想从隐藏其中两个开始。我知道在jquery中，你可以用.hide（）来实现这一点。然而，当我加载页面时，这两个输入出现然后消失。.show（）和.hide（）对元素做了什么？它会改变显示吗？我如何才能在页面加载时隐藏元素，然后在需要时调用.show（）？

我现在拥有的代码如下。我想要的是，我不必在ready函数中调用.hide（），并且元素开始时是隐藏的。

$(document).ready(function ()
{
//loads elements then hides them
  $("#input3").hide();
  $("#input4").hide();
//some time later when triggers are set and I want to show the inputs
  $("#input3").show();
  $("#input4").show();
}

我想要什么：

$(document).ready(function ()
{
//inputs 3 and 4 are already hidden
//some time later when triggers are set and I want to show the inputs
  $("#input3").show();
  $("#input4").show();
}

在html元素中添加display none

<input type="text" id="input1" style="display: none" />

或带有css

#input1, #input2 {
  display: none;
}

您可以将其初始样式display设置为none。最好避免内联样式。

CSS

#input3, #input4 {
  display: none;
}

在您的情况下，您的jQuery正在处理此问题。在执行之前，您的HTML会被解析&因此您可以看到CCD_ 5，直到您的CCD_。

希望它能有所帮助！

创建这样的css。

.hide
{
display : none
}

并将hide类用于最初要隐藏的div。

您需要使用css隐藏输入字段。

<input type="text" name="input_name" id="input_id" />
#input_id{
display:none;
}

当你需要显示这个输入字段时，只需调用一个类似的js函数

$('#input_id').show()
相关文章：