HTML 里怎么隐藏文本框,html 中input的隐藏

HTML 里怎么隐藏文本框?
有三种:
1、<input type="hidden" value=""> 这是对任何元素都起作用的:
2、

<input type="text" value="" "style="display:none"> 或 <input type="text" value=""

style="visibility:hidden"> 

3、<input type="text" value="" style="width:0;height:0">

html 中input的隐藏

<input type="submit" name="submit" value="Submit"  style="display:none;"/>

http://blog.csdn.net/llxsharp/article/details/4285262

http://blog.csdn.net/shaobingj126/article/details/6625570

HTML,你可以使用JavaScript或者jQuery来实现点击按钮隐藏文本框的功能。这我将给出一个简单的示例,演示如何使用HTML、CSS和基本的JavaScript来完成这个任务。 ```html <!DOCTYPE html> <html lang="en"> <head> <style> .hidden { display: none; } </style> </head> <body> <input type="text" id="myText" placeholder="输入内容"> <button onclick="hideInput()">隐藏文本框</button> <script> function hideInput() { var input = document.getElementById("myText"); input.classList.toggle("hidden"); } </script> </body> </html> ``` 在这个例子: 1. `input`元素是你的文本框,`placeholder`属性提供了输入提示。 2. `button`元素是一个点击按钮,`onclick`事件被设置为调用`hideInput`函数。 3. JavaScript的`hideInput`函数会获取具有`id`为`myText`的输入框,然后通过改变它的`class`(添加或移除`hidden`)来切换其显示状态,当`hidden`存在时,文本框会被隐藏。 如果你想要使用更现代的方式,比如使用jQuery,代码会稍微简洁些: ```html <!DOCTYPE html> <html lang="en"> <head> <style> .hidden { display: none; } </style> <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script> </head> <body> <input type="text" id="myText" placeholder="输入内容"> <button id="hideBtn">隐藏文本框</button> <script> $(document).ready(function () { $('#hideBtn').click(function () { $('#myText').toggleClass('hidden'); }); }); </script> </body> </html> ``` 在这个jQuery版本,我们引入了jQuery库,并且在`#hideBtn`按钮上绑定了一个点击事件,点击时会切换`#myText`的`hidden`样式。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值