关于HTML下拉列表改变文本框属性_html/css_WEB-ITnose-html教學-PHP中文網

回复讨论(解决方案)

首頁

web前端

html教學

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

WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWB

Jun 24, 2016 am 11:57 AM

html 下拉屬性改變文字方塊

比如

想在下拉框选中 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>

登入後複製

<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>

登入後複製

这样确实可以实现，但是当在显示的时候文本框会换到下一行....有方法解决这个问题吗 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>

登入後複製

如果还原默认的话就可以不换行了，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>

登入後複製

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

<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>

登入後複製

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

- -没办法啊~~你来晚了~~~我以为没人回复了就把帖子结了.

本網站聲明

本文內容由網友自願投稿，版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容，請聯絡admin@php.cn