如何使用 JavaScript 隐藏表单 div 的一部分?

威尔士77

我从这个平台得到了一些代码并实现了它来隐藏我的表单 div 元素的一部分。但是它可以工作,但是当我在浏览器中运行它时,它看起来像是隐藏和取消隐藏。当我点击按钮隐藏它时,它会快速隐藏和取消隐藏我该如何解决这个问题?

关于我尝试过的代码显示如下:

.hide{

  display: none !important;
  visibility: hidden !important; 
}

.show{

display: block;
visibility:visible;

}

<!-- begin snippet: js hide: false console: true babel: false -->
<html>
<head>
    <title>

    </title>

    <script src="jquery/jquery-3.4.1.min.js"></script>
    <script src="jquery/jquery-3.4.1.slim.min.js"></script>
     <link rel="stylesheet" href="test.css">

    <script>


        $(document).ready(function() {
          //console.log('hello');
       
          $("#btn").on("click", function(){
            $("#form1").addClass("hide");
          })

        });

        
         //document.getElementById("form1").style.visibility="hidden";
          //document.getElementById("form1").style.display="none";
          
      
        </script>
        


</head>
<body>
<form>

<div id= "form1" class="show">
<label>Name</label>

<input type="text"/>
</div>

<br> <br>

<div id="form2">
<label>Email</label>

<input type="text"/>

</div>


<button type="submit" id="btn">more</button>


</form>




</body>


</html>

努曼·扬朱亚

按钮类型应该是 type="button" <button type="button" id="btn">more</button>

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

如何在脚本启动时隐藏未使用的变量的一部分

单击时隐藏/显示表单的一部分。如何调试?

如何使用CSS或JavaScript仅显示视频帧的一部分?

如何在R中隐藏/星号代码的一部分?

如何隐藏div的一部分以在其后面看到?

Vue.js使用计算属性显示或隐藏组件的一部分

如何防止背景色隐藏斜体文本的一部分

如何在angularjs中保持可折叠div的第一部分

如何通过按钮隐藏边框的一部分

如何使a框架成为HTML网格的一部分并占用父div的宽度?

如何在Angular中隐藏图表或div的一部分?

如何不显示超出其div范围的图像的一部分

使用JavaScript获取URL的一部分

如何仅将我的精灵图像的一部分重复作为div的背景

Javascript在单选按钮更改时隐藏表单的一部分

用tinyscrollbar隐藏div的一部分,直到调整窗口大小

使用正则表达式在div内获取文本的一部分

如何在recyclerview中隐藏字符串的一部分?

隐藏div元素而不隐藏div的一部分

如何隐藏ChartJS气泡图背景的一部分?

如何显示一个div,它是php代码的一部分

如何在 CSS/React 中隐藏 div 的一部分?

如何使用 javascript 从 url 中获取最后一部分?

如何使用Javascript用数组的一部分替换元素的内部HTML文本

使用 RewriteRule 隐藏 URL 的一部分

如何使用 Javascript 获取 URL 字符串的一部分?

如何使用javascript regexp替换字符串的一部分

如何在 PHP 中隐藏/替换字符串的一部分?

如何平滑地隐藏元素的一部分