把form表单数据转为json,并传给父页面

 阻止form表单提交,表单数据转为json字符串,并传给父页面

// 获取表单元素var form = document.getElementById('myForm');// 监听表单提交事件form.addEventListener('submit', function(event) {// 在这里处理表单提交的逻辑var rental_id = $("#c-id").val();if (rental_id == 0){event.preventDefault(); // 阻止表单默认提交行为}// 将表单数据转换为 JSON 对象const formData = new FormData(form);const jsonData = {};for (const [key, value] of formData.entries()) {const formattedKey = key.replace('row[', '').replace(']', '');jsonData[formattedKey] = value;}const jsonResult = JSON.stringify(jsonData);// 将 JSON 对象传递给父页面window.parent.postMessage(jsonResult, '*');});

 form表单键名 没有row[  ],使用此

for (const [key, value] of formData.entries()) {jsonData[key] = value;}

父页面进行json数据接收

// 监听消息事件window.addEventListener('message', function(event) {var jsonData = event.data; // 获取传递的 JSON 数据console.log('jsonData',jsonData); // 在控制台输出 JSON 数据// 在这里可以对接收到的数据进行处理$("#c-jsonKey").val(jsonData);});

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/589638.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

gem5学习(8):创建一个简单的缓存对象--Creating a simple cache object

目录 一、SimpleCache SimObject 二、Implementing the SimpleCache 1、getSlavePort() 2、handleRequest() 3、AccessEvent() 4、accessTiming() (1)缓存命中:sendResponse() (2)缓存未命中: 三、…

实现3x3卷积的手写FIFO

例子来自米联科例程, 因为不同平台之间调IP会变麻烦,重新阅读手册太花时间了(虽然我觉得fifo这种常用IP尽量掌握为好),使用手写的FIFO可以节约开发的流程。 通过这个例子也可以优化自己所使用的手写FIFO。 // by C…

matlab概率论例子

高斯概率模型: [f,xi] ksdensity(x): returns a probability density estimate, f, for the sample in the vector x. The estimate is based on a normal kernel function, and is evaluated at 100 equally spaced points, xi, that cover the range of the da…

Mybatis行为配置之Ⅰ—缓存

专栏精选 引入Mybatis Mybatis的快速入门 Mybatis的增删改查扩展功能说明 mapper映射的参数和结果 Mybatis复杂类型的结果映射 Mybatis基于注解的结果映射 Mybatis枚举类型处理和类型处理器 再谈动态SQL Mybatis配置入门 Mybatis行为配置之Ⅰ—缓存 Mybatis行为配置…

读书笔记1-C++ Primer Plus

C是在C语言基础上开发的一种集面向对象编程(OOP)、通用编程和传统的过程化编程于一体的编程语言。本书是根据2003年的ISO/ANSI C标准编写的,通过大量短小精悍的程序详细而全面地阐述了C的基本概念和技术。 全书分17章和10个附录,分…

我的2024

我的2024 前言 今天是2024年的第一天,2024年是我人生中比较有意义的一年吧,从一个无忧无虑的大学生到一位社会工作人事,从一个不需要考虑任何事情,可以每天自自在在的做自己想做的事情到即将为了自己的工作,父母的身…

使用WAZUH检测LD_PRELAOD劫持、SQL注入、主动响应防御

目录 1、检查后门 使用工具检测后门 1.chkrootkit 2.rkhunter 手动检查文件 检查ld.so.preload文件 2、检测LD_PRELOAD ubuntu配置 wazuh配置 3、检测SQL注入 ubuntu配置 攻击模拟 4、主动响应 wauzh的安装以及设置代理可以参考本篇:WAZUH的安装、设置…

代码随想录算法训练营第二十天 | 654.最大二叉树、617.合并二叉树、700.二叉搜索树中的搜索、 98.验证二叉搜索树

654.最大二叉树 题目链接:654.最大二叉树 给定一个不重复的整数数组 nums 。 最大二叉树 可以用下面的算法从 nums 递归地构建: 创建一个根节点,其值为 nums 中的最大值。递归地在最大值 左边 的 子数组前缀上 构建左子树。递归地在最大值 右边 的 子…

Apache Flink连载(二十三):Flink HA - Flink基于Yarn HA

🏡 个人主页:IT贫道_大数据OLAP体系技术栈,Apache Doris,Clickhouse 技术-CSDN博客 🚩 私聊博主:加入大数据技术讨论群聊,获取更多大数据资料。 🔔 博主个人B栈地址:豹哥教你大数据的个人空间-豹哥教你大数据个人主页-哔哩哔哩视频 目录 1. Yarn HA配置 ​​​​…

Cache替换算法

由于Cache很小,主存很大,Cache很容易装满,Cache满了怎么办? ——采用替换算法。 全相联映射:Cache完全满了才需要替换,需要在全局中选择替换哪一块。直接映射:如果对应位置非空,则…

linux线程与进程

简要 在Linux系统中,进程(Process)和线程(Thread)是操作系统中两个重要的概念,它们都是用于执行程序的执行单元,但有一些关键的区别。 在Linux系统中,可以使用fork系统调用创建新…

Vue3-30-路由-嵌套路由的基本使用

什么是嵌套路由 嵌套路由 &#xff1a;就是一个组件内部还希望展示其他的组件&#xff0c;使用嵌套的方式实现页面组件的渲染。 就像 根组件 通过路由渲染 普通组件一样&#xff0c;嵌套路由也是一样的道理。 嵌套路由的相关关键配置 1、<router-view> 标签 声明 被嵌套组…

在 Spring 中操作 Redis

&#x1f9f8;欢迎来到dream_ready的博客&#xff0c;&#x1f4dc;相信您对博主首页也很感兴趣o (ˉ▽ˉ&#xff1b;) &#x1f4dc;redis和缓存及相关问题和解决办法 什么是缓存预热、缓存穿透、缓存雪崩、缓存击穿 目录 1、引入依赖 2、对 Redis 的配置文件进行书写 3、S…

kivy PageLayout 的说明及例子

PageLayout 是 Kivy GUI 框架中的一个布局管理器&#xff0c;它允许开发者在同一个窗口中放置多个页面&#xff0c;用户可以通过滑动来浏览这些页面。PageLayout 的工作方式类似于一个可以滑动的标签页&#xff08;TabbedPanel&#xff09;&#xff0c;但其页面可以自由调整大小…

【Python_PySide2学习笔记(二十二)】进度对话框QProgressDialog类的基本用法

进度对话框QProgressDialog类的基本用法 进度对话框QProgressDialog类的基本用法前言一、QProgressDialog 的常用方法1、创建进度对话框2、进度对话框设置窗口标题3、进度对话框隐藏"最大化"、"最小化"、"关闭"4、进度对话框设置是否自动关闭5、…

Atlas Hook 导入 Hive 元数据

Atlas 部署之后就可以导入 Hive 元数据&#xff0c;这部分工作由 Atlas 组件 Hook 来完成。初次导入 Hive 元数据需要通过执行 shell 脚本来完成&#xff0c;然后&#xff0c;Atlas 就可以自动同步增量元数据信息了。下面我介绍一下如何完成这些工作。 初次导入 Hive 元数据 …

LLM、AGI、多模态AI 篇一:开源大语言模型简记

文章目录 系列开源大模型LlamaChinese-LLaMA-AlpacaLlama2-ChineseLinlyYaYiChatGLMtransformersGPT-3(未完全开源)BERTT5QwenBELLEMossBaichuan

使用Py2neo进行Neo4j图数据库的增删改查操作

使用Py2neo进行Neo4j图数据库的增删改查操作 Neo4j 是一个高效的图形数据库管理系统&#xff0c;它将数据结构存储为图形而非表格。Py2neo 是一个客户端库&#xff0c;用于使用 Python 语言与 Neo4j 交互。它提供了一系列简单易用的 API&#xff0c;使得在 Python 中进行图形数…

Linux常用命令大全总结及讲解(超详细版)

前言&#xff1a; Linux 是一个基于Linux 内核的开源类Unix 操作系统&#xff0c;Linus Torvalds于 1991 年 9 月 17 日首次发布的操作系统内核。Linux 通常打包为Linux 发行版。 Linux 最初是为基于Intel x86架构的个人计算机开发的&#xff0c;但此后被移植到的平台比任何其…

K8S 中对 Windows 节点的利用

目录 漏洞概述 漏洞详情 ​编辑 漏洞验证 补丁分析 在集群中探索 参考资料 在许多组织中&#xff0c;所运行的很大一部分服务和应用是 Windows 应用。Windows 容器提供了一种封装进程和包依赖项的方式&#xff0c;从而简化了 DevOps 实践&#xff0c;令 Windows 应用程序…