根据条件决定是否为input设置只读属性

代码如下:

 1 <!DOCTYPE html>
 2 <html>
 3     <head>
 4         <meta charset="UTF-8">
 5         <title>根据条件决定是否为input设置只读属性(兼容ie8)</title>
 6         <link rel="stylesheet" type="text/css" href="css/bootstrap.min.css" />
 7     </head>
 8     <body>
 9         <div class="jumbotron" style="background-color: #fff;">
10             <form action="" method="post" class="form-horizontal">
11                 <div class="form-group form-group-sm">
12                     <label for="notice" class="col-sm-4 control-label">是否只读:</label>
13                     <div class="col-sm-4">
14                         <select id="notice" name="notice" class="form-control">
15                            <option value="1"></option>
16                               <option value="0"></option>
17                         </select>
18                     </div>
19                 </div>
20                 <div class="form-group form-group-sm">
21                     <label for="reqAddress" class="col-sm-4 control-label">显示input是否只读:</label>
22                     <div class="col-sm-4">
23                         <input type="text" name="reqAddress" id="reqAddress" class="form-control" />
24                     </div>
25                 </div>
26             </form>    
27         </div>
28         <script src="js/jquery.min.js" type="text/javascript" charset="utf-8"></script>
29         <script>
30             // 根据条件决定是否填写请求地址
31             var notice=$('#notice').val();
32             $('#notice').change(function(){
33                 notice = $('#notice').val();
34                  switch (notice) {
35                     case "1":
36                         $('#reqAddress').prop('readonly',false);
37                         // $('#reqAddress').readOnly=false;   此设置无效
38                     break ;
39                     case "0":
40                         $('#reqAddress').prop('readonly',true);
41                         // $('#reqAddress').readOnly=true;    此设置无效
42                     break;
43                 }
44             })
45         </script>
46     </body>
47 </html>
原文地址:https://www.cnblogs.com/ljblog/p/7808171.html