ui点击确定清空表格表单整个数据
时间: 2023-11-24 15:12:14 浏览: 58
vue+ElementUI 关闭对话框清空验证,清除form表单的操作
您可以在“确定”按钮的点击事件中编写代码,以清空表格表单数据。具体实现方式取决于您使用的 UI 框架和表单库,以下是一些示例代码:
使用 jQuery 和表单元素的 reset() 方法:
```
$('#confirm-button').click(function() {
$('#form')[0].reset(); // 清空表单
});
```
使用 Vue.js 和表单数据绑定:
```
<template>
<div>
<form>
<input v-model="username">
<input v-model="password">
<button @click.prevent="confirm">确定</button>
</form>
</div>
</template>
<script>
export default {
data() {
return {
username: '',
password: ''
}
},
methods: {
confirm() {
this.username = '';
this.password = '';
}
}
}
</script>
```
使用 React 和表单数据绑定:
```
class Form extends React.Component {
constructor(props) {
super(props);
this.state = {
username: '',
password: ''
};
this.confirm = this.confirm.bind(this);
}
confirm() {
this.setState({
username: '',
password: ''
});
}
render() {
return (
<form>
<input value={this.state.username} onChange={(e) => this.setState({username: e.target.value})} />
<input value={this.state.password} onChange={(e) => this.setState({password: e.target.value})} />
<button onClick={this.confirm}>确定</button>
</form>
);
}
}
```
阅读全文