Rumah >hujung hadapan web >html tutorial >关于HTML下拉列表改变文本框属性_html/css_WEB-ITnose
关于HTML下拉列表改变文本框属性_html/css_WEB-ITnose
- WBOYasal
- 2016-06-24 11:57:011444semak imbas
比如
想在 下拉框选中 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的话就成块级元素了，必须的换行啊 - -没办法啊~~你来晚了~~~我以为没人回复了就把帖子结了.
Kenyataan：
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel sebelumnya：纯css3实现的3D按钮_html/css_WEB-ITnoseArtikel seterusnya：Codeforces Round #269 (Div. 2) A~D_html/css_WEB-ITnose