zoukankan      html  css  js  c++  java
  • 【HTML5】表单元素

    * datalist

    datalist 元素规定输入域的选项列表。

    列表是通过 datalist 内的 option 元素创建的。

    如需把 datalist 绑定到输入域,请用输入域的 list 属性引用 datalist 的 id:

    <!DOCTYPE HTML>
    <html>
    <body>
    
    <form action="/example/html5/demo_form.asp" method="get">
    Webpage: <input type="url" list="url_list" name="link" />
    <datalist id="url_list">
        <option label="W3School" value="http://www.w3school.com.cn" />
        <option label="Google" value="http://www.google.com" />
        <option label="Microsoft" value="http://www.microsoft.com" />
    </datalist>
    <input type="submit" />
    </form>
    
    </body>
    </html>

    * keygen

    keygen 元素的作用是提供一种验证用户的可靠方法。

    keygen 元素是密钥对生成器(key-pair generator)。当提交表单时,会生成两个键,一个是私钥,一个公钥。

    私钥(private key)存储于客户端,公钥(public key)则被发送到服务器。公钥可用于之后验证用户的客户端证书(client certificate)。

    目前,浏览器对此元素的糟糕的支持度不足以使其成为一种有用的安全标准。

    <!DOCTYPE HTML>
    <html>
    <body>
    
    <form action="/example/html5/demo_form.asp" method="get">
    Username: <input type="text" name="usr_name" />
    Encryption: <keygen name="security" />
    <input type="submit" />
    </form>
    
    </body>
    </html>

    * output

    <!DOCTYPE HTML>
    <html>
    <head>
    <script type="text/javascript">
    function resCalc()
    {
    numA=document.getElementById("num_a").value;
    numB=document.getElementById("num_b").value;
    document.getElementById("result").value=Number(numA)+Number(numB);
    }
    </script>
    </head>
    <body>
    <p>使用 output 元素的简易计算器:</p>
    <form onsubmit="return false">
     <input id="num_a" /> +
     <input id="num_b" /> =
     <output id="result" onforminput="resCalc()"></output>
    </form>
    
    </body>
    </html>
  • 相关阅读:
    python之天气爬虫
    python之一异常问题(TypeError: object of type 'NoneType' has no len())
    数据分析之漏斗分析
    python之pytest_addoption : 命令行参数
    python之一driver.find_element_by_xpath与driver.find_element(by, value)的区别
    python之正则表达式从列表中取值报类型错误
    python之append和extend的区别
    pyton之字典的使用
    python之pd.DataFrame函数使用
    python之正则表达式 re.findall 用法
  • 原文地址:https://www.cnblogs.com/anni-qianqian/p/5585586.html
Copyright © 2011-2022 走看看