用jQuery重写。saveBtn.addEventListener('click', function() { if (arr) { localStorage.setItem('data', JSON.stringify(arr)) } else { localStorage.setItem('data', JSON.stringify([])) arr = [] } init() })
时间: 2024-01-27 14:06:33 浏览: 19
使用jQuery重写后的代码如下:
```
$(document).on('click', '#saveBtn', function() {
if (arr) {
localStorage.setItem('data', JSON.stringify(arr));
} else {
localStorage.setItem('data', JSON.stringify([]));
arr = [];
}
init();
});
```
这里使用了jQuery的事件委托方式,将事件绑定在整个document上,通过选择器来指定目标元素。同时也可以省略saveBtn变量,直接在选择器中使用即可。
相关问题
function showModal(type, index) { let modal = document.getElementById('modal'); let form = modal.querySelector('form'); let saveBtn = modal.querySelector('#save-btn'); let cancelBtn = modal.querySelector('#cancel-btn'); if (type === 'add') { form.reset(); saveBtn.textContent = '添加'; } else if (type === 'edit') { let contact = contacts[index]; form.name.value = contact.name; form.phone.value = contact.phone; form.email.value = contact.email; saveBtn.textContent = '保存'; } modal.style.display = 'block';怎么给里面的编辑和删除按钮添加样式
你可以在 HTML 代码中为编辑和删除按钮添加类名,然后在 CSS 中定义这些类的样式。例如:
HTML 代码:
```
<button class="edit-btn">编辑</button>
<button class="delete-btn">删除</button>
```
CSS 代码:
```
.edit-btn {
background-color: blue;
color: white;
border: none;
padding: 5px 10px;
cursor: pointer;
}
.delete-btn {
background-color: red;
color: white;
border: none;
padding: 5px 10px;
cursor: pointer;
}
```
在这个示例中,我们为编辑按钮和删除按钮分别添加了 `edit-btn` 和 `delete-btn` 类,并为这些类定义了一些基本的样式,包括背景颜色、文字颜色、边框、内边距和鼠标指针样式。你可以根据自己的需要调整这些样式。
我若想在form.on('submit(saveBtn)',中获取呢?或者用juqrey
如果你想在form.on('submit(saveBtn)',中获取表单数据,可以使用以下代码:
```javascript
form.on('submit(saveBtn)', function(e) {
e.preventDefault(); // 阻止表单默认提交行为
var formData = $(this).serialize(); // 获取表单数据
// 处理表单数据...
});
```
其中,`$(this).serialize()` 方法可以将表单中所有的字段序列化为字符串形式,方便后续处理。你也可以使用 `$(this).serializeArray()` 方法将表单数据序列化为数组形式。
如果你想使用 jQuery 获取表单数据,可以使用以下代码:
```javascript
var formData = $('form').serialize();
```
其中,`$('form')` 表示选择所有的 `<form>` 元素,`.serialize()` 方法同样可以将表单数据序列化为字符串形式。