JavaScript 通过 preventDefault() 使 input[type=text] 禁止输入但保留光标

一、说明

取消事件的默认动作。

该方法将通知 Web 浏览器不要执行与事件关联的默认动作（如果存在这样的动作）。例如，如果 type 属性是 "submit"，在事件传播的任意阶段可以调用任意的事件句柄，通过调用该方法，可以阻止提交表单。注意，如果 Event 对象的 cancelable 属性是 fasle，那么就没有默认动作，或者不能阻止默认动作。无论哪种情况，调用该方法都没有作用。

二、语法

event.preventDefault()

三、示例

3.1 阻止<a>元素跳转

<a href="http://www.mazey.net/baby/blog" target="_blank" id="a-prevent">点击我看会不会跳转</a>
<script>
document.getElementById('a-prevent').addEventListener('click',function(e){
    var eObj = e || window.event;
    eObj.preventDefault();
});
</script>

点击我看会不会跳转

另外可以通过return false;来阻止a元素跳转事件。

<script>
    function preventGO(){
        return false;
    }
</script>
<a href="http://www.mazey.net/baby/blog/" onclick="return false;">点击我看会不会跳转1</a><br />
<a href="http://www.mazey.net/baby/blog/" onclick="preventGO();">点击我看会不会跳转2</a><br />
<a href="http://www.mazey.net/baby/blog/" onclick="return preventGO();">点击我看会不会跳转3</a>

点击我看会不会跳转1
点击我看会不会跳转2
点击我看会不会跳转3

3.2 禁止<input>元素键盘输入

<input type="text" id="input-prevent" placeholder="试试能不能输入" />
<script>
document.getElementById('input-prevent').addEventListener('keypress',function(e){
    var eObj = e || window.event;
    eObj.preventDefault();
});
</script>