Heim > Web-Frontend > HTML-Tutorial > 关于HTML下拉列表改变文本框属性_html/css_WEB-ITnose

关于HTML下拉列表改变文本框属性_html/css_WEB-ITnose

WBOY
Freigeben: 2016-06-24 11:57:01
Original
1444 Leute haben es durchsucht

比如 
    
想在 下拉框选中 2时 文本框隐藏 让style 属性="display:none"   试了好多中方法都行,是不能改style的值吗?


回复讨论(解决方案)

<select  name="select" onChange="disinput(this)">                	<option value="1">1</option>                	<option value="2">2</option>                    </select>    <input type="text" id="text" name="text"  value="" />	<script type="text/javascript">		function disinput(obj){			if(obj.value==2){				document.getElementById("text").style.display="none";			}else{document.getElementById("text").style.display="block";}		}	</script>
Nach dem Login kopieren
Nach dem Login kopieren

<select  name="select" onChange="disinput(this)">                	<option value="1">1</option>                	<option value="2">2</option>                    </select>    <input type="text" id="text" name="text"  value="" />	<script type="text/javascript">		function disinput(obj){			if(obj.value==2){				document.getElementById("text").style.display="none";			}else{document.getElementById("text").style.display="block";}		}	</script>
Nach dem Login kopieren
Nach dem Login kopieren

这样确实可以实现,但是当在显示的时候文本框会换到下一行....有方法解决这个问题吗 T T~ @ly12530 @Null_Reference

<select  name="select" onChange="disinput(this)">                <option value="1">1</option>                <option value="2">2</option>                </select><input type="text" id="text" name="text"  value="" /> <script type="text/javascript">	function disinput(obj){		if(obj.value==2){			document.getElementById("text").style.display="none";		}else{document.getElementById("text").style.display="";}	}</script>
Nach dem Login kopieren
Nach dem Login kopieren

如果还原默认的话就可以不换行了,block的话就成块级元素了,必须的换行啊

用JQuery帮你写了一个,你看看,选1就显示文本框,选2就消失

<html xmlns="http://www.w3.org/1999/xhtml"><head runat="server">    <title></title>    <script type="text/javascript" src="jquery.js"></script>    <script type="text/javascript">        $(function () {                   });        function changeSel() {            if ($("#select1").val() == 2) {                $("#text").addClass("class2");            } else {                $("#text").removeClass("class2");            }        }    </script>    <style type="text/css">        .class2        {           display:none;        }    </style></head><body>    <select id="select1"  name="select" onChange="changeSel()">                 <option value="1">1</option>                 <option value="2">2</option>                    </select>    <input type="text" id="text" name="text"  value="" /></body></html>
Nach dem Login kopieren

尼玛,白做好人了,一分没有,

<select  name="select" onChange="disinput(this)">                <option value="1">1</option>                <option value="2">2</option>                </select><input type="text" id="text" name="text"  value="" /> <script type="text/javascript">	function disinput(obj){		if(obj.value==2){			document.getElementById("text").style.display="none";		}else{document.getElementById("text").style.display="";}	}</script>
Nach dem Login kopieren
Nach dem Login kopieren

如果还原默认的话就可以不换行了,block的话就成块级元素了,必须的换行啊

  - -没办法啊~~你来晚了~~~我以为没人回复了就把帖子结了.
Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage