html 中隐藏input文本框中的值

html-css017

html 中隐藏input文本框中的值,第1张

jquery

获取

input

文本框中的值方法始终是相同的,与是否隐藏无关,隐藏与不隐藏都能获取到值;

<script>

var

value

=

$('#demo').val()

//

直接根据

input

的id

获取值

var

value

=

$('.demo').val()

//

根据input

的class

类获取值,此方法需保证只有一个input

使用该class

类,否则始终返回第一个使用该class

类的input

的值

var

value

=

$('#thisdiv

input').val()

//

var

value

=

$('#thisdiv

.demo').val()

//

根据父元素定位input

获取值

以上的方法都能获取到

input

中的值,与div

是否隐藏没关系

</script>

工具:hml、js

1、首先新建个hml文件,为页面建立一个exarea输入控件。

2、为了实现操作,这里添加了两个按钮用来控制对exarea的显示和隐藏。

3、为这两个按钮配备对exarea操作的函数,Showex和Hiddenex。

4、Showex用来控制显示,函数内容是将exarea的display设置为"block"。Hiddenex用来控制隐藏,函数内容是将exarea的display设置为"none"。

5、运行脚本,点击隐藏按钮实现隐藏。

6、可以看到文本框已经隐藏。点击显示按钮又会将文本框显示回来,显示隐藏都可以操作。

可以用border属性去除文本框的边框。

1、新建html文档,在body标签中添加一些input标签,这时默认情况下浏览器中的文本框有1px的边框:

2、在head标签中添加style标签,设置input的样式,这里为了演示方便,为文本框设置灰色的背景色:

3、为input标签设置边框“border”属性,属性值为“0”,这时网页中文本框的边框就被去掉了: