layer.alert弹出会关闭layer.open弹出的窗口问题

本文详细介绍了如何在Layer弹窗组件中配置参数以实现特定功能,如设置保证金金额的弹窗,通过调整type属性避免prompt关闭的问题。同时,讲解了输入验证的方法,确保用户输入符合正则表达式的数字格式。

 解决方法:给layer.open加个 type:1 

 layer.prompt({
        formType: 2,
        // value: row.bondMoney,
        title: '设置保证金金额',
        type:1,   //  加一个type就可以了  打开 layer.alert 后layer.prompt就不会关闭了
        content: '<div><p>请设置保证金</p><input name="bondMoney" id="bondMoney" placeholder="" style=""/>元</div>',
        area: ['350px', '250px'], //自定义文本域宽高
        maxlength: 10, //整数位7位小数位2位
        yes: function (index, layero) {
            var bondMoneyStr = $('#bondMoney').val();//获取多行文本框的值
           if(!bondMoneyStr.match(/^(\d+[.]\d+|\d+)$/gi))
                layer.alert('请输入0-9999999之间的正数,最多两位小数', {
                    icon: 5,
                    title: "提示"
                });
                return false;
            }
            saveBond(row.id, bondMoney, index);
        }
    });
<think>我们参考了用户提供的引用内容,特别是引用[1]和引用[2]明确说明了anim参数的值对应的动画效果。用户的问题是关于layer.alert(或layer.open等)中anim参数0-6分别代表的动画效果。 根据引用[1]和引用[2]: - anim: 0 平滑放大(默认) - anim: 1 从上掉落 - anim: 2 从最底部往上滑入 - anim: 3 从左滑入 - anim: 4 从左翻滚 - anim: 5 渐显 - anim: 6 抖动 另外,如果想显示动画,可以设置 anim: -1。 注意:3.0之前的版本使用的是shift参数,但现在已改为anim参数。 因此,我们可以整理成表格形式: | anim参数值 | 动画效果描述 | |------------|----------------------| | 0 | 平滑放大(默认效果) | | 1 | 从上掉落 | | 2 | 从底部往上滑入 | | 3 | 从左滑入 | | 4 | 从左翻滚 | | 5 | 渐显 | | 6 | 抖动 | 同时,我们也可以参考引用[3]中的示例代码,其中使用了`anim: 1`,表示从上掉落的动画效果。 最后,我们生成相关问题,这些问题layer的动画效果相关,以帮助用户进一步了解。</think>### Layui layer.alert 中 anim 参数详解(0-6) 在 Layui 的 layer 弹框组件中,`anim` 参数控制弹框的出场动画效果。根据官方文档说明(引用[1][2]),参数值 0-6 对应以下动画效果: | anim 值 | 动画效果描述 | 代码示例 | |---------|----------------------|----------------------------------| | **0** | 平滑放大(默认效果) | `layer.alert('内容', {anim: 0})` | | **1** | 从上掉落 | `layer.alert('内容', {anim: 1})` | | **2** | 从底部往上滑入 | `layer.alert('内容', {anim: 2})` | | **3** | 从左滑入 | `layer.alert('内容', {anim: 3})` | | **4** | 从左翻滚 | `layer.alert('内容', {anim: 4})` | | **5** | 渐显 | `layer.alert('内容', {anim: 5})` | | **6** | 抖动 | `layer.alert('内容', {anim: 6})` | #### 特殊说明: 1. **禁用动画**:设置 `anim: -1` 可完全禁用动画效果(引用[1][2]) 2. **浏览器兼容**:所有动画均通过 CSS3 实现,支持除 IE6-9 外的所有现代浏览器(引用[1][2]) 3. **版本变更**:3.0 之前版本使用 `shift` 参数控制动画,新版已统一改为 `anim` 参数(引用[2]) 4. **组合使用**:可与其他参数搭配使用,如引用[3]中的示例: ```javascript layer.alert('内容', { anim: 1, // 从上掉落动画 skin: '自定义样式', icon: 6 // 成功图标 }); ``` > 提示:动画效果的选择应考虑用户体验,重要提示建议使用默认平滑放大(anim:0),娱乐性内容可尝试抖动效果(anim:6)[^1]。
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值