根据select标签中option选项的变化动态更改表单元素

今天做项目时，有一个功能点，需要根据select标签中option选项的变化动态来决定表单中某一行是否显示。

一开始绞尽了脑汁，试了各种方法，都无法达到要求，万幸突然想起来select标签有一个onchange属性，只要将所要执行的动态变化写成一个单独的函数，并在onchange事件中调用该函数就行了。

在这里记录如下：

表单：

			<form>
				<table>
					<tr>
						<td>代码：</td>
						<td><input name="sCode" readonly="readonly"/><input type="hidden"
							name="a_id" /></td>
					</tr>
					<tr>
						<td>名称 ：</td>
						<td><input name="aName" readonly="readonly"/></td>
					</tr>
					<tr>
						<td>是否限制：</td>
						<td>
						<select id="limitFlag" name="limitFlag" 
							οnchange="show_or_hide(this.value)">
								<option value="-1">请选择</option>								
								<option value="2">是</option>
								<option value="1">否</option>																			
						</select></td>
					</tr>
					<tr>
						<td class="limitCount_input">限制数量：</td>
						<td class="limitCount_input"><input name="limitCount" id="limitCount"/></td>
					</tr>
				</table>
			</form>

js部分：

function show_or_hide(v){
	    	if(v == "-1" || v == "1"){
	    		$(".limitCount_input").hide();
	    	}else if(v =="2"){
	    		$(".limitCount_input").show();
	    	}
	    }

这样就可以了。

实际使用时发现刚打开该页面时限制数量还是会有显示，在JS部分中添加如下代码即可：

$(document).ready(function(){	
	    	$(".limitCount_input").hide();
	    });

当然。如果使用hide()和show()显得很突兀的话，可以将其更改为attr("disabled","disabled");与removeAttr("disabled");来设置其是否可操作。

（错误，详细见评论1L）

经过这件事，发现自己还是too young。毕竟刚刚入门，还有很多要学的。曾经见过的onchange事件到关键时刻也是想了很久才想起来，看来还是需要加强对文档的阅读。当然，经常使用才是王道。