js-form表单元素的自定义属性

原创

Marydon 2023-02-15 10:29:26 博主文章分类：Html ©著作权

文章标签 HTML元素 form表单自定义属性 input标签 文章分类 Python 后端开发

©著作权归作者所有：来自51CTO博客作者Marydon的原创作品，请联系作者获取转载授权，否则将追究法律责任

场景：

<script type="text/javascript">
    var name = "lisi";
　　function test1 () {
　　　　var name = "zhang";
　　　　function test2 () {
　　　　　　console.log(this.name);
　　　　}    
　　　　alert(name);
　　　　//return test2;
　　} 
</script>

<input onSuccess="test1()" onError="错误" name="userName" value="zhang"/>

获取input文本框的值及自定义属性值

<script type="text/javascript">
　　window.onload = function () {
　　　　/**
　　　　 * 获取下面这个input标签
　　　　 */
　　　　//方法一：根据name获取--这种获取方式，如果存在多个input标签的name="userName"的，返回就是
　　　　//一个数组；如果只有，返回的就是该标签对象（只获取form表单定义的name）
　　　　var inputUnameTag = document.all.userName;
　　　　/**
　　　　 * 方法二：也是根据name获取    
　　　　 * var inputUnameTag = document.getElementsByName("userName")[0];
　　　　 */
　　　　/**
　　　　 * 方法三：根据input标签获取
　　　　 * var inputUnameTag = document.getElementsByTagName("input")[0];
　　　　 */
　　　　//获取该标签的自定义onSuccess属性
　　　　/**
　　　　 * 自定义属性的值的获取方式
　　　　 * 错误方式：
　　　　 * var aa = inputUnameTag.onSuccess; 自定义属性无法通过这种方式获取
　　　　 * 正确的方式为：使用getAttribute()方法
　　　　 */
　　　　var errorMsg = inputUnameTag.getAttribute("onError");//errorMsg的值为：错误
　　　　/**
　　　　 * 运行自定义属性调用的方法
　　　　 * 错误方式：
　　　　 * var ee = inputUnameTag.getAttribute("onSuccess");//这样获取的是字符串"test1()"
　　　　 * 正确方式：eval（)
　　　　 */
　　　　var result = eval（inputUnameTag.getAttribute("onSuccess"));
　　　　//会将test1()当作方法来执行，如果有返回值用变量接收
　　　　console.log(cc); //如果没有定义返回值，则会显示undefined
}
</script>