2.1JavaScript表单事件

表单事件

onfocus 
获得焦点事件
<body>
<form action="">
    <p>用户名<input type="text" id="ipt"></p>
    <p>密--码<input type="password" id="psw"></p>
    <p><input type="submit" id="st"></p>
</form>
</body>
<script>
iptobj= document.getElementById('ipt');
    iptobj.onfocus =function(){
    this.style.outlineColor='#f00';
    this.value='';
    }
</script>

onblur
失去焦点
onchange
onselect
onsumit

事件方法
select()
选中方法

<form action="">
    <p>用户名<input type="text" id="ipt"></p>
    <p>密--码<input type="password" id="psw"></p>
    <p><input type="submit" id="st"></p>

</form>
</body>
<script>
iptobj= document.getElementById('ipt');
    iptobj.onfocus =function(){
        this.style.outlineColor='#f00';
        this.value='';
        this.select();
        //选中方法
    }
</script>

blur()
focus()
click()
submit()
reset()

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 表单基础知识 在HTML中,表单是由 元素来表示的,而在JS中,表单对应的则是HTMLFormElement类型。...
    oWSQo阅读 4,388评论 0 1
  • (续jQuery基础(1)) 第5章 DOM节点的复制与替换 (1)DOM拷贝clone() 克隆节点是DOM的常...
    凛0_0阅读 5,193评论 0 8
  • 总结: 鼠标事件 1.click与dbclick事件$ele.click()$ele.click(handler(...
    阿r阿r阅读 5,531评论 2 10
  • 我在二环路的里边想着你 你在远方的山上春风十里 这周写作老师布置了一篇写人物的作文,一直想写写你,但真正提笔的时候...
    希里i阅读 8,244评论 2 8
  • 南橘北枳的故事 根据《晏子春秋》记载,齐国的晏婴出使楚国,楚灵王想要羞辱晏婴,便在宴会上故意让人带着一个盗窃犯来到...
    廖军阅读 1,891评论 0 0