根据下拉框动态改变联动的状态

根据第一个下拉框的选择，动态改变第二个是文本框还是下拉框；

第一种方法：

<li>
                        <div class="left">报修条件：</div>
                        <div class="right">
                            <select class="checkarea" id="param_type" name="param_type" onchange="cardChange()" placeholder="客户证号" maxlength="32">
                                <option value="customerCode">客户证号</option>
<!--                                 <option value="serialNo">机顶盒号</option> -->
                                <option value="icCard">智能卡号</option>
                            </select>
                        </div>
                    </li>
                    <li>
                        <div class="left"><span>*</span>报修证号：</div>
                        <div class="right" id="textId" style="display: block">
                            <input type="text" class="checkarea" id="param_value" data-name="param_value" maxlength="32" readonly="readonly" value="<%=customercode%>">
                        </div>
                    </li>

根据报修条件的下拉框选择值，改变报修证号的状态；给下拉框绑定一个事件cardChange()

function cardChange(){
        //获取报修条件下拉框的value值
        var selVal = $("#param_type").val();
        var openId = "<%=openId%>";
        var corpId = "<%=area_id%>";
        var customercode = "<%=customercode%>";
        $.ajax({
            url:'getCardId.jspx?openId='+openId+'&corpId='+corpId,
            data:[],
               type:'POST',
            timeout:50000,
            contentType:'application/www-form-urlencoded;charset=utf-8',
            success:function (data){
                if(data != ''){
                    var jsonDa = eval('('+data+')')
                    //清空
                    $("#textId").empty();
                    //选择的值
                    if(selVal == "customerCode") {
                        //选择客户证号
                        $("#textId").append("<input type='text' class='checkarea' id='param_value' data-name='param_value' maxlength='32' readonly='readonly' value='" + customercode + "'>");
                    } else if(selVal == "icCard") {
                        //选择智能卡号
                        //根据id加入元素
                        var selectHtml = "<select class='checkarea' id='param_value' name='param_value'>";
                        for(var i = 0; i < jsonDa.length; i ++){
                            var map = jsonDa[i];
                             selectHtml += "<option value='"+ map.CARDNO +"'>" + map.CARDNO + "</option>";
                        }
                        selectHtml += "</select>";
                        $("#textId").append(selectHtml);
                    }
                }
            }
        })
        
    }

 第二种方法：

<tr>
	<td class="form_table_title">活动类型：</td>
	<td class="form_table_content" colspan="3">
		<select style="width:160px" id="activity_type" name="activity_type" onchange="toChangeActType();" >
			<option value="0">微信绑定</option>
			<option value="1">微信缴费</option>
			<option value="3">微信关注</option> 
		</select><font color="#ff0000"> * </font>
	</td>
</tr>
<tr id="specamount" style="display:none">
	<td class="form_table_title">活动缴费金额：（单位：元）</td>
	<td class="form_table_content" colspan="3">
		<input type="text" name="pay_money" id="pay_money"  onkeyup="this.value=this.value.replace(/\D/g,'')" onafterpaste="this.value=this.value.replace(/\D/g,'')"/>
	</td>
</tr>
	<tr id="recenum" style="display:none">
	<td class="form_table_title">领取次数限制</td>
	<td class="form_table_content" colspan="3">
		<input type="text" name="number_limit" id="number_limit"  onkeyup="this.value=this.value.replace(/\D/g,'')" onafterpaste="this.value=this.value.replace(/\D/g,'')"/>
	</td>
</tr>

根据下拉框的选择，动态显示下面的输入框

function toChangeActType(){
		var activity_type= $('#activity_type').val();
		if(activity_type == '1'){
			document.getElementById("specamount").style.display="";
			document.getElementById("recenum").style.display="";
		} else if (activity_type == '0'){
			document.getElementById("specamount").style.display="none";
			document.getElementById("recenum").style.display="none";
		} else if (activity_type == '3'){
			document.getElementById("specamount").style.display="none";
			document.getElementById("recenum").style.display="none";
		} 
	}

document.getElementById("specamount").style.display="";而不是写成document.getElementById("specamount").style.display="block";

经测试发现写成后面的会改变页面布局，导致样式不正常。

扩展：

onkeyup="this.value=this.value.replace(/\D/g,'')"

首先这是个正则式验证，用来验证输入值的规则；当输入值的键盘抬起时触发这个事件。this.value表示此输入框的值，/\D/g为正则表达式，用来匹配所有非数字字符；

此句功能为：将输入值为非数字的字符替换为空；

onkeyup 事件会在键盘按键被松开时发生，onafterpaste 是粘贴触发；

获得焦点和失去焦点

获得焦点时触发函数

<script>
function setStyle(x) {
    document.getElementById(x).style.background="yellow";
}
</script>
</head>
<body>
  
<p>当输入字段获得焦点时触发函数。此函数改变输入字段的背景色。</p>
  
First name: <input type="text" id="fname" onfocus="setStyle(this.id)"><br>
Last name: <input type="text" id="lname" onfocus="setStyle(this.id)">
  
</body>

onblur 属性在元素失去焦点时触发。

onblur 常用于表单验证代码（例如用户离开表单字段）。

<script>
    function upperCase() {
    var x=document.getElementById("fname").value
    document.getElementById("fname").value=x.toUpperCase()
}
</script>
</head>
<body>
  
<p>请输入您的姓名，然后把焦点移动到字段外：</p>
请输入您的姓名（英文字符）：<input type="text" name="fname" id="fname" onblur="upperCase()">
  
</body>