js后退(js禁止后退)满满干货

HTML 中使用 <input> 元素表示单行输入框和 <textarea> 元素表示多行文本框。HTML中使用的 &l

 

HTML 中使用 元素表示单行输入框和 元素表示多行文本框HTML中使用的 元素在 JavaScript 中对应的是 HTMLInputElement。

类型HTMLInputElement 继承自 HTMLElement 接口：interfaceHTMLInputElementextendsHTMLElement{ ... }HTMLInputElement。

类型有一些独有的属性和方法：name：表示 元素的名称disabled：表示 元素是否禁止使用在表单提交时不会包含被禁止的 元素autofocus：表示页面加载时，该元素是否会自动获得焦点。

required：表示表单提交时，该 元素是否为必填value：表示该 元素的值validity：返回一个 ValidityState 对象，表示 元素的校验状态。

是只读属性validationMessage：表示 元素校验失败时，用户看到的报错信息如果该元素不需要校验，或者通过校验，该属性为空字符串是只读属性willValidate：表示表单提交时，。

元素是否会被校验是只读属性select()：选中 元素内部的所有文本click()：模拟鼠标点击当前的 元素而在上述介绍 HTMLInputElement。

类型中的属性时，type 属性要特别关注一下，因为根据 type 属性的改变，可以改变的属性类型描述text文本输入password密码输入submit表单数据提交button按钮radio。

单选框checkbox复选框file文件hidden隐藏的字段image定义图像作为提交按钮reset重置按钮省略 type 属性与 type="text"效果一样， 元素显示为文本框当

type 的值为text/password/number/时，会有以下属性对 元素有效属性类型描述autocompletestring字符串on或off，表示元素的输入内容可以被浏览器自动补全。

maxLengthlong指定元素允许的最多字符数sizeunsigned long表示元素的宽度，这个宽度是以字符数来计量的patternstring表示元素的值应该满足的正则表达式

placeholderstring表示元素的占位符，作为对元素的提示readOnlyboolean表示用户是否可以修改的值minstring表示元素的最小数值或日期。

maxstring表示元素的最大数值或日期selectionStartunsigned long表示选中文本的起始位置如果没有选中文本，返回光标在元素内部的位置selectionEnd。

unsigned long表示选中文本的结束位置如果没有选中文本，返回光标在元素内部的位置selectionDirectionstring表示选中文本的方向可能的值包括forward、backward

、none下面创建一个 type="text" ，一次显示 25 个字符，但最多允许显示 50 个字符的文本框：

"initial value">HTML 使用的 元素在 JavaScript 中对应的是 HTMLTextAreaElement 类型HTMLTextAreaElement类型继承自 。

HTMLElement 接口：interfaceHTMLTextAreaElementextendsHTMLElement{ ... }HTMLTextAreaElement 类型有一些独有的属性和方法：

form：只读属性，返回对父表单元素的引用如果此元素未包含在表单元素中，则它可以是同一文档中 id 属性同 form 值的 元素，如果没有，该值为 nulltype：只读属性，返回字符串textarea

value：string类型，返回/设置控件中包含的原始值textLength：只读属性，long类型，返回元素的value值的长度与 value.length 相同defaultValue。

：string类型，返回/设置textarea元素的默认值placeholder：string类型，返回/设置 textarea 元素的占位符，作为对输入内容的提示rows：unsigned long类型，返回/设置

textarea元素的可见文本行数cols：unsigned long类型，返回/设置 textarea 元素的可见宽度autofocus：boolean类型，返回/设置textarea元素在页面加载时自动获取焦点。

name：返回/设置 textarea 元素的名称disabled：boolean类型，返回/设置 textarea 元素是否应当被禁用HTMLTextAreaElement.labels：NodeList。

类型，返回与此select元素关联的标签元素列表maxLength：long类型，返回/设置元素可以输入的最大字符数仅在值更改时才评估此约束minLength：long类型，返回/设置元素可以输入的最小字符数。

仅在值更改时才评估此约束accessKey：boolean类型，返回/设置访问 textarea 的键盘快捷键readOnly：boolean类型，返回/设置 textarea 元素是否为只读required。

：boolean 类型，返回/设置 textarea 元素是否为必填项tabIndex：long类型，返回/设置 textarea 元素的 tab 键导航顺序中元素的位置下面创建一个高度为 25，宽度为 5 的 。

多行文本框它与 不同的是，初始值显示在 ... 之间：initial value。

注意：处理文本框值的时候最好不要使用 DOM 方法，而应该使用 value 属性选择文本 与 都支持 select() 方法，该方法用于选中文本框中的所有内容。

该方法的语法为：select(): void下面看一个示例：let textbox = document.forms[0].elements["input-box"]; textbox.select();

也可以在文本框获得焦点时，选中文本框的内容：textbox.addEventListener("focus", (event) => { event.target.select(); });select 事件

当选中文本框中的文本或使用 select() 方法时，会触发 select 事件let textbox = document.forms[0].elements["textbox1"]; textbox.addEventListener(。

"select", (event) => { console.log(`Text selected: ${textbox.value}`); });取得选中的文本HTML5 对 select 事件进行了扩展，通过

selectionStart 和 selectionEnd 属性获取文本选区的起点偏移量和终点偏移量如下所示：functiongetSelectedText(textbox){ return textbox.value.substring(textbox.selectionStart, textbox.selectionEnd); }

注意：在 IE8 及更早版本不支持这两个属性选中部分文本HTML5 提供了 setSelectionRange() 方法用于选中部分文本：setSelectionRange(start, end, direction): 。

void;start：被选中的第一个字符的位置索引，从 0 开始如果这个值比元素的 value 长度还大，则会被看做 value 最后一个位置的索引end：被选中的最后一个字符的下一个位置索引如果这个值比元素的 。

value 长度还大，则会被看做 value 最后一个位置的索引direction：该参数是可选的字符串类型，表示选择方向，可以传入 “forward”/“backward”/“none” 三个值下面看一个例子：

选中部分文本