频道栏目
首页 > 资讯 > JavaScript > 正文

javascript基础label标签焦点转移

17-02-25        来源:[db:作者]  
收藏   我要投稿
<article>
    <h1>Contact the band</h1>
    <form method="post" action="submit.html">
        <fieldset>
            <p>
                <label for="name">Name:</label>
                <input type="text" id="name" name="name" placeholder="Your name" required="required" />
            </p>
            <p>
                <label for="email">Email:</label>
                <input type="email" id="email" name="email" placeholder="Your email address" required="required" />
            </p>
            <p>
                <label for="message">Message:</label>
                <textarea cols="45" rows="7" id="message" name="message" required="required" placeholder="Write your message here."></textarea>
            </p>
            <input type="submit" value="Send" />
        </fieldset>
    </form>
</article>

首先我们先用form包裹表单 用fieldset分组表单 然后给每个表单项用label和input来实际生成 这里的label有个for属性 他指向了某个name为同名的表单项 假设你点击这个label 那么会自动给这个label指向的表单项获得焦点
但是 这种方法并不是所有浏览器都支持 我们完全可以自己去写一个js方法达到这种效果

function getFocus() {
    if(!document.getElementsByTagName) return false;
    var label = document.getElementsByTagName("label");
    if(label.length == 0) return false;
    for(var i=0 ; i<label.length .onclick="function" for_elem="document.getElementById(for_name);" for_name="this.getAttribute("for");" pre="" return="" var="">

要注意的地方 能用this调用的东西就在 onclick函数里面就可以 不要在外面声明 因为带不进去 里面无法调用 如果必须在外围声明 则需要用.属性的方法带进去 另外oncilck后面不能有括号 有括号那这本身就会被识别成函数

相关TAG标签
上一篇:javascript正则表达式(2)——JS预定义类及边界
下一篇:JS操作字符串的方法
相关文章
图文推荐

关于我们 | 联系我们 | 广告服务 | 投资合作 | 版权申明 | 在线帮助 | 网站地图 | 作品发布 | Vip技术培训 | 举报中心

版权所有: 红黑联盟--致力于做实用的IT技术学习网站