`

javascript 基础知识

 
阅读更多

获取表单

Js代码 复制代码 收藏代码
  1. document.forms[0]   
  2. document.forms["mainForm"]     
  3. <form name="mainForm"></form>   
document.forms[0]
document.forms["mainForm"]  
<form name="mainForm"></form>



表单中元素

Js代码 复制代码 收藏代码
  1. document.forms[0].elements["element1"]   
  2. document.mainForm.element1;   
  3. <input name="element1" />   
document.forms[0].elements["element1"]
document.mainForm.element1;
<input name="element1" />



每个表单元素都支持form属性

Js代码 复制代码 收藏代码
  1. this.form //指向元素所在的表单  
this.form //指向元素所在的表单



访问文本域

Js代码 复制代码 收藏代码
  1. myform.elements["textfield"].value;  
myform.elements["textfield"].value;



复选框

Js代码 复制代码 收藏代码
  1. myform.elements["chkbox"][i].checked? "checked":"not checked";  
myform.elements["chkbox"][i].checked? "checked":"not checked";



单选框

Js代码 复制代码 收藏代码
  1. f.elements["radiobutton"][i].value;   
  2. f.elements["radiobutton"][i].checked?"checked":"not checked";   
f.elements["radiobutton"][i].value;
f.elements["radiobutton"][i].checked?"checked":"not checked";



列表框

Js代码 复制代码 收藏代码
  1. var index = f.elements["selectionlist"].selectedIndex;   
  2. //selectedIndex: 当前所选中列表项的索引（从0开始），“-1”表示未选值   
  3. //options: 所有列表项组成的数组。   
  4. //options[index] 选中的node   
  5.   
  6. //对于每一个option   
  7. //selected属性，为true时表示被选中。   
  8. //value 选中的发送数据   
  9. //text 显示的文字   
  10.   
  11. //获取列表框当前选择的值   
  12. f.elements["selectionList"].options[f.elements["selectionList"].selectedIndex].value   
  13.   
  14. //动态添加列表元素   
  15. for(var i=0;i<links.length; i++){   
  16.      elements["urls"].options[elements["urls"].options.length]=new Option(links[i].title, links[i].url);   
  17. }  
var index = f.elements["selectionlist"].selectedIndex;
//selectedIndex: 当前所选中列表项的索引（从0开始），“-1”表示未选值
//options: 所有列表项组成的数组。
//options[index] 选中的node

//对于每一个option
//selected属性，为true时表示被选中。
//value 选中的发送数据
//text 显示的文字

//获取列表框当前选择的值
f.elements["selectionList"].options[f.elements["selectionList"].selectedIndex].value

//动态添加列表元素
for(var i=0;i<links.length; i++){
     elements["urls"].options[elements["urls"].options.length]=new Option(links[i].title, links[i].url);
}



禁用表单元素

Js代码 复制代码 收藏代码
  1. f.elements["password"].disabled = true; //变灰   
  2. f.elements["password"].readOnly= true; //不变色   
  3. <input type="text" onfocus="this.blur();" />   
f.elements["password"].disabled = true; //变灰
f.elements["password"].readOnly= true; //不变色
<input type="text" onfocus="this.blur();" />



防止表单提交

Html代码 复制代码 收藏代码
  1. <form onsubmit="return checkform(this);">  
<form onsubmit="return checkform(this);">



防止重复提交

Html代码 复制代码 收藏代码
  1. <input type="submit" value="submit" onclick="this.disable=true;" />  
<input type="submit" value="submit" onclick="this.disable=true;" />



设置焦点

Js代码 复制代码 收藏代码
  1. document.forms[0].elements["textField"].focus();  
document.forms[0].elements["textField"].focus();



选中表单域中的文本

Js代码 复制代码 收藏代码
  1. var field = f.elements["textField"];   
  2. if(field.createTextRange){//IE   
  3.      var range = field.createTextRange();   
  4.      range.moveStart("character",0);   
  5.      range.moveEnd("character",field.value.length-1);   
  6.      range.select();   
  7. }else if(field.setSelectionRange){//Other brower   
  8.      field.setSelectionRange(0.field.value.length);   
  9. }   
  10. field.focus();  
var field = f.elements["textField"];
if(field.createTextRange){//IE
     var range = field.createTextRange();
     range.moveStart("character",0);
     range.moveEnd("character",field.value.length-1);
     range.select();
}else if(field.setSelectionRange){//Other brower
     field.setSelectionRange(0.field.value.length);
}
field.focus();



获取元素的表单域类型

Js代码 复制代码 收藏代码
  1. element.type   
  2. //所有元素的type属性都可以返回相应的表单域类型: button, checkbox, password, radio, reset, select-one, select-multiple, submit, text, textarea  
分享到：
| javascript对table的添加，删除行的操作
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    javascript基础知识总结

    以下是对JavaScript基础知识的总结，主要关注在网页中使用的弹出对话框、函数调用以及带有参数的函数。 1) Alert Box `alert()` 函数用于显示一个包含警告信息的单行对话框，用户只能点击“确定”按钮关闭它。在...

    JavaScript基础知识点汇总（代码+知识点）

    这份“JavaScript基础知识点汇总”涵盖了从基础到进阶的多个方面，帮助开发者系统地理解和掌握这一语言。以下是详细的JavaScript知识点解析： 1. **变量**：在JavaScript中，我们可以使用`var`, `let`, 或 `const` ...

    JavaScript基础知识例子

    总的来说，这个压缩包提供了一个全面的JavaScript基础知识教程，涵盖了数据类型、Object、内置对象和变量等核心概念，对于初学者或者需要巩固基础的开发者来说，是一份非常有价值的参考资料。通过学习这些内容，可以...

    JavaScript基础知识总结

    1. JavaScript 的基础知识 在学习 JavaScript 之前，你需要了解 HTML 和 XHTML 的基础。JavaScript 被设计用来向 HTML 页面添加交互行为，通过在 HTML 中插入 JavaScript 代码，可以实现页面元素的动态操作和用户...

    javascript 基础知识 18

    javascript 基础知识

    javascript 基础知识 17

    javascript 基础知识

    javascript 基础知识 16

    javascript 基础知识

    javascript 基础知识 15

    javascript 基础知识

    javascript 基础知识 14

    javascript 基础知识

    javascript 基础知识 13

    javascript 基础知识

    Javascript基础知识整理.doc

    Javascript基础知识整理 JavaScript是一种高级的、动态的、弱类型的编程语言，主要用于客户端脚本编程。它可以在浏览器中执行，实现网页的交互性和动态效果。本文将对JavaScript的基础知识进行整理和总结，包括脚本...

    JavaScript学习笔记,javascript基础知识,基础语法整理.pdf

    JavaScript基础知识点总结 JavaScript是一种高级的、动态的、基于对象的客户端脚本语言。它是在网页上执行的脚本语言，能实现网页的交互功能。下面是该资源中的重要知识点总结： 一、 JavaScript 基本概念 * ...

    Javascript基础知识

    本文将详细介绍JavaScript的基础知识，包括它的编程基础、工作原理、在HTML中的使用方法，以及数据类型、变量、常量、运算符、表达式、控制流程和数组等核心概念。 首先，JavaScript最初由Netscape公司开发，是一种...

Magicbox
Global site tag (gtag.js) - Google Analytics