zoukankan      html  css  js  c++  java
  • How to set the default input focus on a field in an HTML web form

     

    When I create a web-based user interface I tend to be a fanatic about making sure that the first input field on a form gets input focus when the form is first displayed. It always drives me crazy when I go to a web form that requires text input, but the developer of the page hasn't taken the time to put the default focus in the first field of the form.

    So ... after looking around at some HTML/JSF/Struts/JSP code I've written over the last few years, the following JSF example shows the most concise way I know of setting default input focus on an HTML form field:

    <h:form id="contact_add">
    <table>
    <tr>
      <td>Contact Name:</td>
      <td><h:inputText id="contact_name" size="20" value=""/></td>
      <td><h:message for="contact_name"/></td>
    </tr>
    <!-- the rest of your form would be here ... ->
    </table>
    </h:form>
    
    <!-- code to set the default input focus -->
    <script>
      document.getElementById('contact_add:contact_name').focus();
    </script>
    

      

    In this example I use the 

    document.getElementById('contact_add:contact_name').focus(); 
    

      

    syntax to put the default input focus in the textfield named contact_add:contact_name. When using JSF, this is the name JSF ends up applying to my "first name" textfield. In your code just use the name of your HTML component.

  • 相关阅读:
    四则运算 calc()
    如何创建width与height比例固定的元素
    eslint规则 中文备注
    使用gulp构建工具
    JavaScript 给表格排序
    【转】grunt动态生成文件名
    vim正则表达式(转)
    正则表达式30分钟入门教程(转)
    hdu 1874 Dijkstra算法
    centos7.4安装mysql
  • 原文地址:https://www.cnblogs.com/hephec/p/4586798.html
Copyright © 2011-2022 走看看