election-egg 自定义通知弹窗兼容win7和win10

最新推荐文章于 2025-01-12 11:02:19 发布

有坑喊我哈

最新推荐文章于 2025-01-12 11:02:19 发布

阅读量342

点赞数 3

文章标签： javascript 前端 electron electron-egg

本文链接：https://blog.youkuaiyun.com/GuanZhong12345/article/details/140432762

版权

实现效果

多个相同类型消息(a,a-1)只会显示一个弹窗，然后叠加；不同类型消息（abc）显示多个弹窗，上下叠加,点击不同消息跳转不同页面

代码

notifi.html

<!DOCTYPE html>
<html>

<head>
  <meta charset="UTF-8">
</head>

<body onclick="clickBody()">
  <image class="image_close" src="../../../public/images/ic_close.png" mode="scaleToFill" onclick="clickClose(event)" />
  <div class="content">
    <h3 id="title"></h3>
    <h4 id="subtitle" style="display: none;"></h4>
    <p id="content"></p>
  </div>
</body>
<style>
  body {
    font-family: Arial, sans-serif;
    margin: 0;
    padding: 20px;
  }

  h1 {
    font-size: 24px;
    margin: 0 0 5px;
  }

  p {
    font-size: 16px;
    margin: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .image_close {
    position: absolute;
    top: 10px;
    right: 10px;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    cursor: pointer;
  }
</style>
<script>
  const { ipcRenderer } = window.require('electron');

  // 解析查询字符串为对象的函数
  function getQueryParams() {
    const queryParams = {};
    // location.search 会返回 URL 的查询参数部分（以 '?' 开头）
    const queryStr = window.location.search.substring(1);
    const params = queryStr.split('&');
    for (let i = 0; i < params.length; i++) {
      const pair = params[i].split('=');
      // decodeURIComponent 用于处理编码后的组件，确保特殊字符被正确解析
      const key = decodeURIComponent(pair[0]);
      const value = decodeURIComponent(pair[1] || '');
      if (key) queryParams[key] = value;
    }
    return queryParams;
  }
  // 使用上面定义的函数来获取查询参数
  const params = this.getQueryParams();
  console.log('params', params);
  // 获取要替换内容的元素
  var titleElement = document.getElementById('title');
  var subtitleElement

最低0.47元/天解锁文章