精华内容
下载资源
问答
  • jsp中,有两个input,当鼠标点击其中一个input时,另一个将被设置成编辑状态; 求大神指教,最好有实例。
  • 表格点击变成input框可编辑

    千次阅读 2016-07-14 16:42:11
    td.input{ position:relative; } td input{ width:100%; border:1px solid #CF5C74; background:#F90; border-radius:4px; display:block; position:absolute; text-align:center; font-size:14px; left:0; top:0...
    <!DOCTYPE html>
    
    <html>
     <head>
      <title></title>
      <meta charset="utf-8" />
     </head>
     <style type="text/css">
    /*demo styles*/
    table{margin:0 auto;border-collapse:collapse; }
    td, th{ width:10%; font-size:14px; padding:10px 0; text-align:center;border:1px solid #ddd; }
    th {background-color:#f4f4f4;} 
    /* input */
    td.input{ position:relative; }
    td input{ width:100%; border:1px solid #CF5C74; background:#F90; border-radius:4px; display:block; position:absolute; text-align:center; font-size:14px; left:0; top:0; padding:11px 0; margin:-1px 0 0 -1px; }
    td.hover{background:#eee;}
    </style>
    <script src="jquery-1.11.3.js"></script>
    <script>
    $(function(){           
    $('table td').click(function(){    
    if(!$(this).is('.input')){    
    $(this).addClass('input').html('<input type="text" value="'+ $(this).text() +'" />').find('input').focus().blur(function(){    
    var thisid = $(this).parent().siblings("th:eq(0)").text();    
    var thisvalue=$(this).val();    
    var thisclass = $(this).parent().attr("class");      
     
    /*
    //ajax将修改后的数据提交到后台
    $.ajax({    
     type: 'POST',    
     url: 'update.php',    
     data: "thisid="+thisid+"&thisclass="+thisclass+"&thisvalue="+thisvalue    
    });  
    */
    $(this).parent().removeClass('input').html($(this).val() || 0);    

      });                        
    }    
    }).hover(function(){    
    $(this).addClass('hover');    
    },function(){    
    $(this).removeClass('hover');    
    });    

    }); 
    </script>
     <body>
    <table border="0" cellpadding="0" cellspacing="0" width="500">
    <thead>
    <tr>

    <th scope="col">列1</th>
    <th scope="col">第二列</th>
    <th scope="col">其他</th>
    </tr>
    </thead>
            <tbody>
      <tr>       
                    <td class="content"></td>
                    <td class="text">测</td>
                    <td class="position">0</td>
                </tr>
      <tr>
                   
                    <td class="content"></td>
                    <td class="text">测</td>
                    <td class="position">0</td>
                </tr>
      <tr>               
                    <td class="content">测</td>
                    <td class="text">%u53D</td>
                    <td class="position">0</td>
                </tr>
      <tr>               
                    <td class="content">测</td>
                    <td class="text">%u624</td>
                    <td class="position">1110</td>
                </tr>
      <tr>                
                    <td class="content">欢</td>
                    <td class="text"></td>
                    <td class="position">0</td>
                </tr>         
            </tbody>
        </table>  
     </body>
    </html>
    展开全文
  • 就类似编辑资料的,都是输入框,点击编辑可以编辑输入框内的内容,点击保存输入框消失
  • 选中一项后,input不能进行编辑 <el-select v-model="input.memoStyle" placeholder="Log Landlord Call" @change="memoStyleChange"> <el-option v-for="item in options" ...

    选中一项后,input框不能进行编辑

    <el-select v-model="input.memoStyle" placeholder="Log Landlord Call"
                     @change="memoStyleChange">
            <el-option
                v-for="item in options"
                :key="item.value"
                :label="item.label"
                :value="item.value">
            </el-option>
          </el-select>
     
    js:
    data() {
          return {
            options: [
              {value: '1', label: 'Listing is still available'},
              {value: '2', label: 'Landlord could not be reached'}
            ],
            input: {}
          }
        },
     
    methods:{
        memoStyleChange(item) {
            if (item == 1) {
              this.input.description = 'Listing is still available';
            } else {
              this.input.description= 'Landlord could not be reached';
            }
    }
    

    直接赋值后导致input框不能进行编辑

    解决方法一、
    改变data数据初始值

    input: {
      description:''
    },
    

    解决方法二、

    methods:{
       memoStyleChange(item) {
           if (item == 1) {
               this.$set(this.input, 'description', 'Listing is still available')
           } else {
               this.$set(this.input, 'description', 'Landlord could not be reached')
           }
    }
    
    原因在于在Vue实例创建时,obj.b并未声明,因此就没有被Vue转换为响应式的属性,自然就不会触发视图的更新,这时就需要使用Vue的全局api $set():
    $set()方法相当于手动的去把obj.b处理成一个响应式的属性,此时视图也会跟着改变了
    展开全文
  • 1.开启disabled,是input不可以编辑 $("#input_id").attr("disabled","disabled");2.关闭disabled $("#input_id").removeAttr("disabled");普通js中是这样写的...

    1.开启disabled,是input不可以编辑

      $("#input_id").attr("disabled","disabled");

    2.关闭disabled

      $("#input_id").removeAttr("disabled");

    普通js中是这样写的,document.getElementById("input_id").disabled = false;

    3.设置input为disabled之后,无法使用

    var formParam = $("#projectForm").serialize();来获取整个form表单的serialize()值

    disabled掉的input值 就不出现在这里面

    所以可以使用另外一种方式 设置输入框不可编辑:readonly,使用语法都是一样的;

    $("#input_id").attr("readonly","readonly");

    $("#input_id").removeAttr("readonly");

    展开全文
  • 点击input编辑内容,点击变下拉框

    千次阅读 2014-07-17 12:50:12
    点击input编辑内容,点击变下拉框演示 XML/HTML Codediv id="page"> table> caption>The database. See your changes here.caption> tr> th>Objectth> th>First nameth> th>Last nameth> th>...

    点击变input编辑内容,点击变下拉框

    点击变input编辑内容,点击变下拉框

     

    XML/HTML Code
    1. <div id="page">  
    2. <table>  
    3. <caption>The database. See your changes here.</caption>  
    4. <tr>  
    5.   <th>Object</th>  
    6.   <th>First name</th>  
    7.   <th>Last name</th>  
    8.   <th>Favourites</th>  
    9.   <th>Direction</th>  
    10. </tr>  
    11. <tr>  
    12.   <td>person</td>  
    13.   <td><span data-bind="text: person.firstname"></span>  
    14.   <td><span data-bind="text: person.lastname"></span>  
    15.   <td> <div style="width: 200px" data-bind="text: person.favourites"></div>  
    16.   <td><span data-bind="text: person.direction"></span>  
    17. </tr>  
    18. <tr>  
    19.   <td>person2</td>  
    20.   <td><span data-bind="text: person2.firstname"></span>  
    21.   <td><span data-bind="text: person2.lastname"></span>  
    22.   <td> <div style="width: 200px" data-bind="text: person2.favourites"></div>  
    23.   <td><span data-bind="text: person2.direction"></span>  
    24. </tr>  
    25. </table>  
    26. <p>  
    27.   
    28. <div id="example-input" class="demo">  
    29. <div class="description">  
    30. <h2>Simple text input field</h2>  
    31. First example is a straightforward text input. Click on the underlined  
    32. text to modify it.  
    33. <ul>  
    34.   <li>The url to post to is supplied.</li>  
    35.   <li>Clicking outside the edit field submits the data</li>  
    36.   <li>Hiting return normally submits the data too</li>  
    37. </ul>  
    38.   
    39. <pre class="example">  
    40.   Firstname <span  
    41.     class="editable"  
    42.     data-url="/internal/person/firstname">John</span>  
    43.   
    44.   <!-- This will set up all edit fields that have class 'editable' on the page -->  
    45.   <!-- So it will only be shown in this example -->  
    46.   <script>  
    47.     $('.editable').jinplace();  
    48.   </script>  
    49. </pre>  
    50. </div>  
    51.   
    52. <div class="try-it">  
    53.   <p>Click on the name to edit  
    54. </div>  
    55. </div>  
    56.   
    57. <div id="example-textarea" class="demo">  
    58. <div class="description">  
    59. <h2>Using a textarea</h2>  
    60. By default you get a normal text input. To get a textarea, then you need to set the  
    61. type to <em>textarea</em>.  
    62. <ul>  
    63.   <li>Set <em>data-type</em> to <kbd>textarea</kbd></li>  
    64.   <li>Everything else is the same as for regular inputs</li>  
    65. </ul>  
    66. <pre class="example">  
    67.   
    68.   <div class="editable"  
    69.     data-type="textarea" data-url="/internal/person/favourites">  
    70.     Wild geese that fly with the moon on their wings  
    71.   </div>  
    72.   
    73. </pre>  
    74. </div>  
    75.   
    76. <div class="try-it">  
    77.   <p>Click textarea, modify and click outside it.</p>  
    78. </div>  
    79. </div>  
    80.   
    81. <div id="example-select" class="demo">  
    82. <div class="description">  
    83. <h2>Using a select dropdown</h2>  
    84. You can also have a list of choices with a select list.  
    85. In this case you must supply the list of possible choices in the <b>data-data</b>  
    86. attribute.  
    87. <ul>  
    88.   <li>Set type to 'select'</li>  
    89.   <li>The data <b>must</b> be given.</li>  
    90.   <li>The data is a JSON string.</li>  
    91. </ul>  
    92. <p>The JSON would normally be generated when the page is built.  
    93. <pre class="example">  
    94.   Direction:  
    95.   <span class="editable" data-type="select" data-url="/internal/person/direction"  
    96.         data-data='[["E", "East"], ["W", "West"]]'>East</span>  
    97.   
    98. </pre>  
    99. </div>  
    100.   
    101. <div class="try-it">  
    102.   <p>Click to enable the select box.</p>  
    103. </div>  
    104. </div>  
    105.   
    106. <div id="example-ok" class="demo">  
    107. <div class="description">  
    108. <h2>With ok button</h2>  
    109. You can add an OK button which must be clicked to accept the change.  
    110. <ul>  
    111.   <li>Adds an OK button that is clicked to submit the data.  
    112.   <li>The text on the button is set to your value.  
    113.   <li>Clicking outside the field, cancels  
    114. </ul>  
    115.   
    116. <pre class="example">  
    117.   Last name <span class="editable"  
    118.                  data-url="/internal/person/lastname"  
    119.                  data-input-class="short"  
    120.                  data-ok-button="Go">Smith</span>  
    121.   
    122. </pre>  
    123. </div>  
    124.   
    125. <div class="try-it">  
    126.   <p>Editing field and click the "Go" button.</p>  
    127. </div>  
    128. </div>  
    129.   
    130. <div id="example-ok-cancel" class="demo">  
    131. <div class="description">  
    132. <h2>With OK and cancel button</h2>  
    133. You can also add a cancel button, again with the text that you specify.  
    134. <ul>  
    135.   <li>Adds an OK button that is clicked to submit the data.  
    136.   <li>Adds a cancel button that is clicked to abandon the edit.  
    137.   <li>The text on the buttons are set to your values.  
    138.   <li>Clicking outside the field does nothing.  
    139. </ul>  
    140. <p>This is particularly useful for large text areas where it is easy  
    141.   to lose a lot of work it you accidentally lose focus.</p>  
    142.   
    143. <pre class="example">  
    144.   Some of their favourite things  
    145.   <div class="editable"  
    146.        data-url="/internal/person/favourites"  
    147.        data-type="textarea"  
    148.        data-ok-button="OK"  
    149.        data-cancel-button="Cancel">  
    150.     Wild geese that fly with the moon on their wings  
    151.   </div>  
    152.   
    153. </pre>  
    154. </div>  
    155.   
    156. <div class="try-it">  
    157.   <p>Click OK to accept changes, Cancel to throw them away.  
    158. </div>  
    159. </div>  
    160.   
    161. <div id="example-activator" class="demo">  
    162. <div class="description">  
    163. <h2>Separate activation button</h2>  
    164. You can have a separate button to click to start editing,  
    165. rather that just clicking on the text.  
    166. Any element can be used.  
    167. <ul>  
    168.   <li>Pass the css selector of the edit element in activator.  
    169.   <li>Clicking the text no longer starts editing (unless  
    170.     that element is included in the selector!)  
    171.   <li>The data-input-class sets the class that will be applied to the input field</li>  
    172. </ul>  
    173. <pre class="example">  
    174.   First name:  
    175.   <span class="editable"  
    176.         data-url="/internal/person/firstname"  
    177.         data-activator="#edit-activator"  
    178.         data-input-class="short"  
    179.       >John</span>  
    180.   
    181.   <span id="edit-activator" class="button">Edit</span>  
    182. </pre>  
    183. </div>  
    184.   
    185. <div class="try-it">  
    186.   <p>Click on the "edit" button to start. Clicking on the field does  
    187.     not activate the edit controls.</p>  
    188. </div>  
    189. </div>  
    190.   
    191. <div id="example-form" class="demo">  
    192. <div class="description">  
    193. <h2>Full form with settings.</h2>  
    194. <p>As well as configuring by using data attributes on the html elements, you can also  
    195.   configure during the .jinplace() call in the usual jQuery manner.  
    196.   You can of course use a mixture of both as you see fit.  
    197. <ul>  
    198.   <li>The url is set, so it is the same for all fields</li>  
    199.   <li>The field to set is determined by the data-attribute</li>  
    200.   <li>The 'placeholder' setting is what is shown when the field is blank</li>  
    201.   <li>The data-placeholder setting can be given on the html element to override the  
    202.     general one.</li>  
    203. </ul>  
    204. <p>There are several more settings and most of them can be used on either the html element  
    205.   or in the call to .jinplace().  
    206. <pre class="example">  
    207.   <p>Firstname: <span class="editable2" data-attribute="firstname">Mary</span>  
    208.   
    209.   <p>Lastname:  <span class="editable2" data-attribute="lastname">Jones</span>  
    210.   
    211.   <p>Direction:  <span class="editable2" data-type="select"  
    212.                        data-data='[["N","North"],["S","South"],["E","East"],["W","West"]]'  
    213.                        data-attribute="direction">West</span>  
    214.   
    215.   <p>Favourites:  
    216.   <div class="editable2" data-type="textarea" data-attribute="favourites"  
    217.       data-placeholder="[Click to add]">  
    218.   </div>  
    219.   
    220.   <script>  
    221.     $('.editable2').jinplace({  
    222.       url: '/internal/person2',  
    223.       placeholder: '[Edit]'  
    224.     });  
    225.   </script>  
    226. </pre>  
    227. </div>  
    228.   
    229. <div class="try-it">  
    230.   <p>All the fields can be edited and viewed in the person2 row at the top of  
    231.     this page.</p>  
    232. </div>  
    233.   
    234. </div>  
    235.   
    236. <div id="example-load" class="demo">  
    237. <div class="description">  
    238. <h2>Load data from server.</h2>  
    239. <p>Sometimes you want to edit a different version of the text than the one that is  
    240.   displayed.  
    241.   The canonical example of this is in wiki text where you need to edit the plain  
    242.   text version, but display the html version of the page.  
    243. <p>There are two ways of doing this</p>  
    244. <ul>  
    245.   <li>By using the data-data attribute</li>  
    246.   <li>By using the data-loadurl attribute</li>  
    247.   <li>Using the loadurl config setting</li>  
    248. </ul>  
    249.   
    250. <pre class="example">  
    251.   <p>Firstname: <span class="editable3" data-attribute="firstname">Mary</span>  
    252.   
    253.   <p>Lastname:  <span class="editable3" data-attribute="lastname">Jones</span>  
    254.   
    255.   <p>Direction:  <span class="editable3" data-type="select"  
    256.                        data-attribute="direction">West</span>  
    257.   
    258.   <p>Favourites:  
    259.   <div class="editable3" data-type="textarea" data-attribute="favourites"  
    260.       data-placeholder="[Click to add]">  
    261.   </div>  
    262.   
    263.   <script>  
    264.     $('.editable3').jinplace({  
    265.       url: '/internal/person2',  
    266.       loadurl: '/internal/person2'  
    267.     });  
    268.   </script>  
    269. </pre>  
    270. </div>  
    271.   
    272. <div class="try-it">  
    273.   <p>When you click to edit, the edit text will be fetched from the server.  
    274.     So the current (probably stale in this demo) text is disregarded.  
    275.     You can view the results of your edits in the person2 row at the top  
    276.     of this page.</p>  
    277. </div>  
    278.   
    279. </div>  
    280.   
    281. <!-- Start of scripts -->  
    282. <script>  
    283. // Just in case there is no console...  
    284. if (!window.console) {  
    285.   var console = {  
    286.     log: function () {  
    287.       var a = arguments;  
    288.     }  
    289.   }  
    290. }  
    291.   
    292. $(function() {  
    293.   var db = {  
    294.     person: {  
    295.       firstname: ko.observable('John'),  
    296.       lastname: ko.observable('Smith'),  
    297.       favourites: ko.observable('Wild geese that fly with the moon on their wings'),  
    298.       direction: ko.observable('E')  
    299.     },  
    300.   
    301.     person2: {  
    302.       firstname: ko.observable('Mary'),  
    303.       lastname: ko.observable('Jones'),  
    304.       favourites: ko.observable(''),  
    305.       direction: ko.observable('W')  
    306.     },  
    307.   
    308.     allowedDirections: [  
    309.       ['N', 'North'], ['NW', 'North West'], ['NE', 'North East'],  
    310.       ['E', 'East'], ['W', 'West'],  
    311.       ['S', 'South'], ['SW', 'South West'], ['SE', 'South East']  
    312.     ]  
    313.   };  
    314.   ko.applyBindings(db);  
    315.   
    316.   // Redefine the $.ajax call to keep the data local to the page.  
    317.   var dataFunc = function (opts, value) {  
    318.     var params = {  
    319.       id: opts.elementId,  
    320.       object: opts.object,  
    321.       attribute: opts.attribute,  
    322.       value: value  
    323.     };  
    324.   
    325.     var url = opts.url;  
    326.   
    327.     console.log("The URL", url);  
    328.     console.log("The data", params);  
    329.   
    330.     var m = url.match(new RegExp('/internal(?:/(\w*)(?:/(\w*))?)?'));  
    331.     var object = m[1] || params.object;  
    332.     var field = m[2] || params.attribute;  
    333.   
    334.     if (value !== undefined) {  
    335.       // set the database value  
    336.       db[object][field](value);  
    337.   
    338.       if (field == 'direction') {  
    339.         $.each(db.allowedDirections, function(i, opt) {  
    340.           if (opt[0] == value)  
    341.             value = opt[1];  
    342.         });  
    343.       }  
    344.   
    345.     } else {  
    346.       value = db[object][field]();  
    347.   
    348.       if (field == 'direction') {  
    349.         var dir = $.extend(true, [], db.allowedDirections);  
    350.         $.each(dir, function(i, opt) {  
    351.           if (opt[0] == value) {  
    352.             opt[2] = 1;  
    353.           }  
    354.         });  
    355.         value = JSON.stringify(dir);  
    356.       }  
    357.     }  
    358.   
    359.     return value;  
    360.   };  
    361.   
    362.   $.fn.jinplace.defaults.submitFunction = dataFunc;  
    363.   $.fn.jinplace.defaults.loadFunction = dataFunc;  
    364. });  
    365. </script>  
    366.   
    367. <script>  
    368. // Arrange to syntax highlight everything and make real working code from the text of the  
    369. // example.  
    370. $(function() {  
    371.   $('.example').each(function () {  
    372.     var $this = $(this);  
    373.   
    374.     var exampleText = $this.text();  
    375.     var syntax = $('<pre class="brush: js; html-script:true"></pre>');  
    376.   
    377.     // We need the actual text inside the example box so that it can be syntax highlighted,  
    378.     // so we convert all '<' to entities.  
    379.     syntax.text(exampleText);  
    380.     $this.html(syntax);  
    381.   
    382.     // Parse the example into html and place it in the try it out column. Voila guaranteed to  
    383.     // be the same as the visible example with no repetition.  
    384.     // Note: parseHTML is only available in jQ 1.8+. Use it if available  
    385.     // otherwise fall back to using jQuery(). This demo currently runs  
    386.     // with jQ 1.7  
    387.     var html;  
    388.     if ($.parseHTML)  
    389.       html = $.parseHTML(exampleText, null, true);  
    390.     else  
    391.       html = $(exampleText);  
    392.     var try_it = $this.parent().parent().find('.try-it');  
    393.   
    394.     var heading = $('<h2>Try it out</h2>');  
    395.     try_it.prepend(heading);  
    396.   
    397.     var dbox = $('<div class="editable-display-box"/>');  
    398.     dbox.html(html);  
    399.     try_it.append(dbox);  
    400.   });  
    401.   
    402.   $('.editable').jinplace();  
    403.   $('.editable2').jinplace({  
    404.     url: '/internal/person2',  
    405.     placeholder: '[Edit]'  
    406.   });  
    407.   $('.editable3').jinplace({  
    408.     url: '/internal/person2',  
    409.     loadurl: '/internal/person2'  
    410.   });  
    411. });  
    412. </script>  
    413. <script>  
    414.   $(function() {  
    415.     SyntaxHighlighter.defaults.toolbar = false;  
    416.     SyntaxHighlighter.defaults['tab-size'] = 2;  
    417.     SyntaxHighlighter.all();  
    418.   });  
    419. </script>  
    420. <script>  
    421.   // If we got here without errors then hide the warning box.  
    422.   if (jQuery && ko && jQuery.fn.jinplace) {  
    423.     $('#invalid').hide();  
    424.   }  
    425. </script>  

     


    原文地址: http://www.freejs.net/article_biaodan_160.html
    展开全文
  • input disabled不能提交表单

    万次阅读 2015-04-07 16:17:06
    今天,在开发过程中发现一个问题,在提交form表单时,有一个input一直不能被提交,后台一直报错!究其原因,是因为该input上设置了disabled属性。然而,有时我们又不得设置某些元素为可操作的,建议使用readonly...
  • 使input文本框编辑的3种方法

    千次阅读 2018-01-13 23:08:22
    disabled 属性规定应该禁用 input 元素,被禁用的 input 元素,编辑可复制,可选择,不能接收焦点,后台也不会接收到传值。设置后文字的颜色会变成灰色。disabled 属性无法与 一起使用。 示例: ...
  • 我用最笨的方法,先实现功能先,用两个input,一个可以编辑,一个可以编辑,失去焦点后隐藏可以点击的那个,点“编辑”时,显示可以编辑的那个input <input type=text id=group-name v-model=groupName class...
  • 弹出框js设置input不编辑不起作用

    千次阅读 2019-03-21 14:17:24
    使用 $("#serialNumber1").attr("disabled",false); 或者 $("#validPeriod").disabled="disabled";...发现都起作用,最后发现使用 $("#o365TypeId").prop('disabled','disabled'); 可以了。 ...
  • 类似51job网上,用户点击编辑后,个人信息可以编辑的功能。 编辑前状态: 实际上,我们看到的编辑前的input添加了以下样式: .readonly{ border:none; background-color:inherit } 所以看上去,是没有...
  • 在项目中我们经常会用到这样的效果,点击一下编辑input 标签,变成可编辑input标签。用法如下 可编辑状态: $(“#content”).attr("readOnly",false); 可可编辑状态: $(“#content”).attr(...
  • 遍历出来多个input输入框和编辑按钮,当点击任意一个按钮可以获取当前这行input的值!知道怎么获取,感觉没标识。 ``` <td><input type="text" name="car_number" class="car_number"> <td><input ...
  • 设置完成后,发现input输入框确实是编辑了,但另一方面,也可用了,即无法点击了。显然,disable不是比较好的方法。 比较好的方法是设置属性readonly,样例如下: <input type="tex
  • vue 设置 input可以编辑

    万次阅读 2019-04-18 13:37:00
    我用最笨的方法,先实现功能先,用两个input,一个可以编辑,一个可以编辑,失去焦点后隐藏可以点击的那个,点“编辑”时,显示可以编辑的那个input <div class="edit-item"> <input type="text" id=...
  • 深入了解input的文本输入框
  • 为啥不能取到input结点,实现input的disabled=false? <td><input value="可持续发展" disabled="disabled"/> <td><input value="edit" type="button" onclick="chosedit(this)"/> </table>
  • 这两天项目刚上线,新版本的需求项目部还没搞出来,瞄了一眼需求中有个待定的原型图是点击编辑的时候在原来位置出来input输入框进行编辑,刚好这个功能我没做过,我百度百度写了几个demo,这样要是到时候真的要做这...
  • 点击button按钮 动态把原来转变成一个input type="text"文本框 文本的默认值是div值 可以对其更改保存。 总价值23948 父母的保单 //css部分 /*动态添加的文本框样式*/ #d3 .newipt{ border:0px; width: 72px; ...
  • <template> <li v-if=‘flag‘><span @click=‘edit()‘>...input type="text" v-else @change=‘input()‘> </template> export default{ data(){ flag:true }, methods:{ edit(){
  • 本文在 iview table 点击input(可编辑)的render函数中如何设置元素的样式(1)的基础上新增加了,当初始化为空时,点击也有input 出现 以及传值时,如何传变量; 先上效果图: 2个事项: ①:当 input初始...
  • 1. disabled 属性规定应该禁用 input 元素,被禁用的 input 元素,编辑可复制,可选择,不能接收焦点,后台也不会接收到传值。设置后文字的颜色会变成灰色。disabled 属性无法与 &lt;input type="...
  • 这个问题设计到vue响应式原理,这里做深究。 简单来说:出现这个问题的本质在于Vue无法监听data中新增的属性删除属性,解决办法要么把属性在对象中罗列出来,要么通过Vue.set新增属性或者 Vue.delete删除属性 ...
  • 最近做的一个响应式项目,在移动端测试时,iphone上输入框input无法获取焦点,如法输入,安卓上周正常,解决方法: 1.使用js解决问题: const input = document.getElementsByTagName('input')[0]; let interval; ...
  • input文本框编辑的3种方法

    千次阅读 2017-08-31 17:25:25
    input文本框编辑的3种方法 1.disabled disabled属性规定应该禁用 input 元素。 被禁用的 input 元素既可用,也点击。可以设置 disabled 属性,直到满足某些其他的条件为止(比如选择了一个复选...
  • 比较简单的javascript实现input双击后可以编辑
  • 如果你要判断input元素是否获得焦点,或者是否处在活动编辑状态,使用jQuery的hasFocus()方法或is(':focus')方法貌似都无效!搜索网上给出的办法,几乎净是采用上述处理方法,然并卵,都是扯淡! 我的解决办法 ...
  • div {border:1px #000 solid; width:120px} window.onload = function(){ document.getElementById("azhi").ondblclick=function(){toInput(this)} } toInput = function(obj){ var o = document.createElement(

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 88,123
精华内容 35,249
关键字:

input不能编辑和点击