layui点击按钮页面会自动刷新的解决方案
作者：扎哈的信徒 发布时间：2024-04-18 09:33:11
标签：layui,点击,按钮,刷新
问题：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<link rel="stylesheet" href="../../layuiadmin/layui/css/layui.css" rel="external nofollow" >
</head>
<body>
<form class="layui-form">
<div class="layui-form-item">
<label class="layui-form-label">输入框</label>
<div class="layui-input-inline">
<input type="text" name="" placeholder="请输入" autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<div class="layui-input-block">
<button class="layui-btn test" >test</button>
</div>
</div>
</form>
<script src="../../layuiadmin/layui/layui.js"></script>
<script>
layui.use(['laytpl','jquery','layer','form'],function () {
var laytpl = layui.laytpl,
layer = layui.layer,
form = layui.form,
$ = layui.$;
$('.test').click(function () {
layer.msg("test");
});
});
</script>
</body>
</html>
点击test按钮后，应该弹出信息“test”，但是运行后没有弹出信息，而是页面刷新了。
原因：
button,input type=button按钮在IE和w3c，firefox浏览器区别：
当在IE浏览器下面时，button标签按钮，input标签type属性为button的按钮是一样的功能，不会对表单进行任何操作。
但是在W3C浏览器，如Firefox下就需要注意了，button标签按钮会提交表单，而input标签type属性为button不会对表单进行任何操作。
解决办法：
方法一：将button标签更换为input
<input class="layui-btn test" >test</input>
方法二：
<button type="button" class="layui-btn test" >test</button>
来源：https://blog.csdn.net/skye_95/article/details/84348507
0
投稿猜你喜欢
watch介绍watch 属性监听 是一个对象，键是需要观察的属性，值是对应回调函数，主要用来监听某些特定数据的变化，从而进行某些具体的业务- 最近在做个大数据量的录入，为了方便客户输入，需要通过方向键来移动到输入框中，本代码仅供学习、研究，请勿用于其它用途:D下面贴的代码只是贴出来
- 配置说明Linux系统：CentOS-7.0MySQL版本：5.7.21Linux系统下启动多个MySQL实例，目前知道有两种方法，一种是通
- 由于python内部的变量其实都是reference，而Tensorflow实现的时候也没有意义去判断输出是否是同一变量名，从而判定是否要新
- 写在前面 众所周知python拥有众多的第三方库，据不完全统计python有1w多个第三方库(为什么是不完全统计，因为我也记不清了☺)，
- 目录前言1.什么是锁2.InnoDB存储引擎中的锁2.1锁的类型2.2 一致性非锁定读2.3 一致性锁定读3 锁的算法3.1行锁的3中算法总
- 一、使用我使用的是python3,可以自行搜索下载二、安装phone模块pip install phone三、测试代码如下：from pho
- Python的property属性的功能是：property属性内部进行一系列的逻辑计算，最终将计算结果返回。使用property修饰的实例
- 前言最近在开发项目时遇到了发现一个问题，gorm虽然可以自动帮你维护 created_at、updated_at、deleted_at这些关
- 协程中未处理的异常会向上冒泡，传给 next 函数或 send 方法的调用方（即触发协程的对 象）。下面示例举例说明如何使用之前博客示例中由
- 1.什么是labelpandas处理数据时，我们会经常看到dataframe结构使用loc, iloc, ix等方法。那么这些方法到底有啥区
- 1.背景 sysbench是一款压力测试工具，可以测试系统的硬件性能，也可以用来对数据库进行基准测试。sysbench 支持的测试
- 本文实例为大家分享了python实现打砖块小游戏的具体代码，供大家参考，具体内容如下开发益智的打砖块小游戏，你可以试一下能打几块import
- TensorFlow更新模型变量。它能一次操作一个数据点，也可以一次操作大量数据。一个训练例子上的操作可能导致比较“古怪”的学习过程，但使用
- 本文实例讲述了JavaScript 扩展运算符用法。分享给大家供大家参考，具体如下：扩展运算符格式扩展运算符格式很简单，就是三个点(…)重点
- 循环结构的应用场景如果在程序中我们需要重复的执行某条或某些指令，例如用程序控制机器人踢足球，如果机器人持球而且还没有进入射门范围，那么我们就
- 什么是Tkinter？Tkinter 是 Python 的标准 GUI 库。Python 使用 Tkinter 可以快速的创建 GUI 应用
- linux安装mysql服务分两种安装方法：①源码安装，优点是安装包比较小，只有十多M，缺点是安装依赖的库多，安装编译时间长，安装步骤复杂容
- 一、pyqt5的UI中嵌入matplotlib的方法1、导入模块导入模块比较简单，首先声明使用pyqt5，通过FigureCanvasQTA
- [前言] 我们经常会遇到多重查询问题，而长长的SQL语句往往让人丈二和尚摸不着头脑。特别是客户端部分填入
