-
TinyMCE编辑器配置正确但是不显示的解决方法
最近给本站的后台管理功能换了一套新的前端模板，在将 TinyMCE 富文本编辑器引入到页面表单时却不显示编辑器主体，反复检查确认了代码配置没有任何问题。在经过一番研究发现，由于表单页面是通过 iframe 引入到主体框架中的，这些表单页面并没有 <!DOCTYPE html> <html> <head> 等 HTML 元素，而 TinyMCE 没有获取到这些元素就认为这不是一个 HTML 页面，因......
-
ThinkPHP6开发wangEditor图片上传接口的方法
wangEditor是一款近几年非常流行的富文本编辑器，它界面简洁，功能非常强大，本文介绍WangEditor图片上传接口的开发，以Thinkphp6为例。 首先看一下wangEditor官方的接口返回要求： 然后开发Thinkphp6的上传功能： public function testup(){ $file = request()->file('file'); $savename = \think......
-
Thinkphp6开发Tinymce图片上传接口的方法
Tinymce是项目开发中常用的编辑器之一，它的功能非常强大，界面简洁，又支持各种各样功能强大的插件，本文介绍一下ThinkPHP6开发Tinymce图片上传接口的方法。 public function uploads(){ $file = request()->file('file'); // 上传到本地服务器 $savename = \think\facade\Filesystem::disk('p......
-
去掉Tinymce图片上传自动添加的相对路径字符
Tinymce 是一款非常强大的富文本编辑器，被广泛的应用在很多web项目中，但 Tinymce 在上传图片时会自动在图片路径 src 前面加上../../这样的相对路径，导致图片路径错误无法显示，这时只需要在初始化 Tinymce 配置 tinymce.init({}) 中设置 convert_urls :false 就可以去除这些多余的字符。 <!-- 实例化编辑器 --> <script> ti......
-
使用 jQuery 高亮显示当前栏目导航链接
高亮显示当前栏目导航链接的原理是：先获取当前页面的 URL 或标识当前页面的导航链接，在文档加载时，使用 jQuery 添加一个特定的类或样式来高亮当前栏目导航链接。 以下是一个基本的示例，展示如何使用 jQuery 高亮显示当前栏目导航链接。在这个例子中，假设导航链接的 href 属性与当前页面的 URL 匹配。 <!DOCTYPE html> <html lang="en"> <head>......
-
实现自动高度的几种 CSS 方法
在前端开发中，经常需要使元素的高度自动调整，以适应其内容的情况。以下是一些常见的 CSS 使用方法： 1. 使用 height: auto;： 将元素的高度设置为 auto，这是元素高度的默认值。这样，元素的高度将根据其内容自动调整。 .auto-height { height: auto; } 2. 使用 overflow: auto; 或 overflow: hidden;： 如果希望元素的高度能够自动适应......
-
使用 Layui 和 jQuery 实现表单验证
对于 Layui 表单验证，可以结合 jQuery 使用 Layui 的验证规则。以下是一个示例，展示了如何使用 Layui 和 jQuery 实现用户名、密码、手机号、邮箱、身份证号的表单验证： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" con......
-
Ajax实现页面无刷新添加数据
使用 Ajax 可以实现页面无刷新添加数据。Ajax（Asynchronous JavaScript and XML）是一种在不重新加载整个页面的情况下与服务器进行通信的技术。以下是一个简单的例子，演示了如何使用 Ajax 在页面中添加数据而不刷新整个页面。 <!DOCTYPE html> <html> <head> <title>Ajax添加数据示例</ti......
-
Ajax实现无刷新文章点赞功能
要实现无刷新的文章点赞功能，可以使用 Ajax 技术。以下是一个简单的例子，演示了如何使用 Ajax 在不刷新页面的情况下处理文章点赞： HTML 页面： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-......
-
Web页面切换深色模式的实现原理
要实现页面切换深色模式并记住用户使用的模式，可以结合使用 JavaScript 和本地存储（LocalStorage 或 Cookies）。以下是一个简单的示例： HTML 页面结构： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content......
