JQuery:聚焦清空输入框值,失焦恢复默认值
时间: 2024-01-20 13:40:24 浏览: 112
输入框默认值
4星 · 用户满意度95%
你可以使用 JQuery 来实现这个功能。首先,给输入框绑定 `focus` 和 `blur` 事件,然后在 `focus` 事件中清空输入框的值,在 `blur` 事件中恢复默认值。下面是代码示例:
HTML:
```html
<input type="text" id="inputBox" value="请输入内容">
```
JQuery:
```javascript
$(function() {
var defaultValue = $('#inputBox').val(); // 获取输入框的默认值
$('#inputBox').focus(function() {
// 聚焦输入框时,如果值等于默认值,则清空输入框
if ($(this).val() === defaultValue) {
$(this).val('');
}
}).blur(function() {
// 失焦输入框时,如果值为空,则恢复默认值
if (!$(this).val()) {
$(this).val(defaultValue);
}
});
});
```
上面的代码会在页面加载完成后执行,首先获取输入框的默认值,然后给输入框绑定 `focus` 和 `blur` 事件。在 `focus` 事件中,如果输入框的值等于默认值,则清空输入框;在 `blur` 事件中,如果输入框的值为空,则恢复默认值。
阅读全文