form控件-提示和正则的使用

已于 2022-09-14 14:41:28 修改
阅读量191 收藏 1
点赞数
分类专栏： 基于Go语言的fyne GUI框架开发 文章标签： fyne
于 2022-09-10 19:13:16 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/shzcy/article/details/126798645
版权

输入框的控件自带两种提示：一种是PlaceHolder 一种是HintText，两者的差别前者是输入框内的文本提示，后者是表单项的提示。

看效果：
在这里插入图片描述

placeHolder

//代码片段
idEntry := widget.NewEntry()
idEntry.PlaceHolder="身份证号"

hint

//代码片段
//因为idEntry是表单中的第一个表单项，所以是Items[0]
form.Items
最低0.47元/天 解锁文章
力行云
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
react-form:用于表单验证的react组件
05-04
React Form通过提供一套API和生命周期方法，使得开发者可以方便地与表单控件进行交互，捕获用户输入，同时在用户提交表单时执行验证。 React Form的核心概念包括以下几个部分： 1. 表单状态管理：React Form允许...
表单元素提示框组件form-tooltip（一）
I_recluse的博客
05-13 1552
在使用form表单元素时，比如input元素可能会有这样的需求，当在input输入框输入无效的文本时，你可能需要在input上方或者下方出现一个悬浮提示框来提示用户，或者当input输入框为空且失去焦点时，你需要有一个提示框来提醒用户。面对这样的需求你可能一时找不到合适的组件来达到目的，只能自己去实现，比较麻烦。本文介绍一个组件: form-tooltip，就是解决这个问题，用户可以根据自己的需求自己设置不同样式的悬浮提示框。
form表单，在label中加入icon图标和tooltip提示语？
SM_Cute的博客
04-07 1760
form表单，在label中加入icon图标和tooltip提示语？
js实现表单form提交前进行确认提示
y2020520的博客
12-28 2640
在jquery中，可以使用confirm来弹出提示框，实现确认提交。下面小编举例讲解js实现表单form提交前进行确认提示。 工具/原料 js+html 代码编辑器：zend studio 10.0 方法/步骤 新建一个html文件，命名为test.html，用于讲解js实现表单form提交前进行确认提示。 在test.html文件中，使用form标签创建一个表单，并设置其id为myForm，用于测试。 在test.html文件中，在form表
antd表单Form.Item添加提示信息
徐同保的专栏
09-16 4126
<Form.Item label="擅长主攻方向" extra={<div className="m-input-footer-msg">666</div>} name="majorScope" rules={[ { required: true, message: '请输入擅长主攻方向！', }...
form表单label添加提示图标
qq_28586135的博客
12-12 1674
form表单label添加提示图标
HTML5新增form控件和表单属性实例代码详解
12-13
本文将详细讲解HTML5中新增的form控件和表单属性，并通过实例代码进行解析。 ### 第一个知识点：表单的属性及总结 在HTML5中，表单元素增加了许多新属性，使得表单验证和处理更加灵活和强大。以下是一些常见的表单...
jquery css 正则验证，漂亮提示
10-25
下面是一个简单的示例，展示如何使用jQuery、CSS和正则表达式实现验证： ```html <form id="myForm"> 邮箱" /> <span id="emailError" class="error"></span> 提交 </form> .error { color: red; display: ...
JS使用正则表达式判断输入框失去焦点事件
10-16
在JavaScript中，我们可以使用`/pattern/flags`语法创建正则对象，其中`pattern`是你要匹配的模式，`flags`是可选的修饰符，如`g`（全局搜索）、`i`（不区分大小写）和`m`（多行模式）。 在这个示例中，我们需要...
form-validation
06-07
4. 可能还包括示例或测试用例，帮助开发者理解如何使用和自定义验证规则。 JavaScript表单验证的基本步骤包括： 1. 获取表单元素：使用`document.getElementById`、`document.querySelector`或`document....
H5，form文本提示
weixin_44479107的博客
05-22 326
<input type="text" name="username" placeholder="小可爱" > <textarea rows="10" cols="30" placeholder="请简单介绍一下自己" ></textarea> placeholder ：在输入框还没有输入的时候，主动提示内容，当输入内容时，自动消失 ...
Oracle Form开发--Form消息提示
dingpianzou7910的博客
11-19 565
消息的使用，我经常看到有的同学喜欢在FORM中直接使用FND_MESSAGE.DEBUG('xxxxx');来显示错误或提示信息，实际上这是非常不正确的做法。顾名思及DEBUG是用来调试的，并不是用来进行人机交互的友好的方式，也不符合Oracle的标准用法。Oracle的标准用法是使用 1 定义消息 登陆ORACLE EBS，在左面的职责里面选择应用开发员，在右面的菜单中选择 “应用...
form表单 弹出提示框问题
weixin_52335549的博客
03-09 2207
form表单 弹出提示框问题 用 e.preventDefault(); 阻止默认行为，阻止提交之后页面跳转，就可以继续后面的操作了，比如alert() 这样的好处是可以利用form表单自身的一些验证功能，只有表单验证都成功了，才能到提交这一步 ...
form表单验证错误提示语太长无法全部展示的问题
migexiaoliang的博客
08-08 2889
form表单验证错误提示语太长无法全部展示的问题
实现表单form提交前进行确认提示 表单提交 确认对话框
热门推荐
LYJ个人博客，记录技术、八卦、生活，分享各种心得，期待与朋友们一同进步
06-04 4万+
定义一个函数： function sumbit_sure(){ var gnl=confirm("确定要提交?"); if (gnl==true){ return true; }else{ return false; } } 然后在form的onsubmit里调用就可以了：
你不知道的form
qq_41818857的博客
03-25 501
<form action="html_form_action.asp" method="get"></form> 1、最常见的就是他的两个属性action和methods action：规定当提交表单时向何处发送表单数据(url) method:用哪种方式发送（post/get)
Form消息提示
夏日青草
09-09 1569
好久沒有來寫相關Form的文章了。 下面給大家收集一下相關Oracle Form的消息提示   1. FND_MESSAGE.SET_STRING(‘’)。 此消息一定要結合FND_MESSAGE.SHOW或FND_MESSAGE.ERROR或FND_MESSAGE.HINT或FND_MESSAGE.WARN或FND_MESSAGE.QUESTION使用才能彈出對話窗口或顯示消息。
elementui 金额控件
最新发布
06-07
Element UI 提供了 el-input 组件，可以通过设置 type 属性为 "number" 或 "tel" 来限制只能输入数字，然后再结合 el-form 组件进行表单验证。以下是一个简单的例子： ```html <template> <el-form ref="form" :model="formData" :rules="rules"> <el-form-item label="金额" prop="amount"> <el-input v-model.number="formData.amount" type="tel" placeholder="请输入金额"></el-input> </el-form-item> <el-form-item> <el-button type="primary" @click="submitForm">提交</el-button> </el-form-item> </el-form> </template> <script> export default { data() { return { formData: { amount: null }, rules: { amount: [ { required: true, message: '请输入金额', trigger: 'blur' }, { pattern: /^\d+(\.\d{1,2})?$/, message: '金额格式不正确', trigger: 'blur' } ] } } }, methods: { submitForm() { this.$refs.form.validate(valid => { if (valid) { // 表单验证通过，提交数据 console.log(this.formData.amount) } else { // 表单验证失败 console.log('验证失败') } }) } } } </script> ``` 在上面的例子中，我们通过设置 type 属性为 "tel" 来限制只能输入数字，然后使用 v-model.number 将输入框的值转化为数字类型。接着定义了一个表单验证规则 rules，其中设置了两个验证规则：必填和金额格式不正确，使用正则表达式限制只能输入整数或小数，小数点后最多保留两位。最后在提交表单时，调用 this.$refs.form.validate 方法进行表单验证，如果验证通过，就可以提交数据了。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值