代码之家 › 专栏 › 技术社区 › m.qayyum

读取chrome的ctrl+p数据

google-chrome-extension google-chrome javascript

m.qayyum · 技术社区 · 6 年前

chrome扩展是否可以读取ctrl+p数据并将其保存为pdf或html而不显示打印屏幕?

0 回复 | 直到 6 年前

Maytham Fahmi 6 年前

您可以使用JavaScript和任何可以保存pdf文档的免费html-to-pdf生成器来解决这个问题。

禁用和覆盖 +
当在步骤1中重写时,调用任何你想要的函数,比如Html到Pdf生成器,它可以保存文档并保存。

就这样。现在代码看起来怎么样?

所以在代码中添加CDN

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.3.4/jspdf.min.js"></script>

//Override ctrl+p and excute another function
$(document).bind("keyup keydown", function(e){
  if(e.ctrlKey && e.keyCode == 80){
    Print(); 
    e.preventDefault();
  }
});

创建一个调用pdfGenerator函数或多个其他函数的打印函数:

//Print My Way
function Print(){
  console.log("for testing to see if this is called");
  pdfGenerator()
}

//Use any other print method, in this case I print/save html to pdf as downloadable
function pdfGenerator(){
  var doc = new jsPDF();
  doc.fromHTML($('body').get(0), 15, 15, {
    'width': 170, 
  });
  // instead of Test.pdf you can make give the name of the page.
  doc.save('Test.pdf');
}

就是这样。如果你需要它只与Chrome一起工作,那么你需要检测浏览器类型 answer .

要查看所有这些示例,请参见完整代码:

<!doctype html>

<html lang="en">
<head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.3.4/jspdf.min.js"></script>
</head>

<body>
  <p>This is my page and ctrl+p will prevent print screen but print this page as downloadable pdf</p>

<script>
  //Override ctrl+p and excute another function
  $(document).bind("keyup keydown", function(e){
    if(e.ctrlKey && e.keyCode == 80){
      Print(); 
      e.preventDefault();
    }
  });

  //Print My Way
  function Print(){
    pdfGenerator()
    //additional function do something else.
  }

  //Use any other print method, in this case I print/save html to pdf as downloadable
  function pdfGenerator(){
    var doc = new jsPDF();
    doc.fromHTML($('body').get(0), 15, 15, {
      'width': 170, 
    });
    doc.save('Test.pdf');
  }
</script>

</body>
</html>

资源:

jsPdf
jQuery

演示

shadow2020 6 年前

要阅读剪贴板上的内容,这是可行的。

async function getClipboardContents() {
  try {
    const text = await navigator.clipboard.readText();
    console.log('Pasted content: ', text);
  } catch (err) {
    console.error('Failed to read clipboard contents: ', err);
  }
}

为了防止CTRL+P把这个放进你的头标签里

<link rel="alternate" media="print" href="alternativeUrlForPrint.ext" />

使用L2i库来捕获控制台中的内容,它将捕获您使用上述代码放在那里的任何内容。然后你只要下载一个函数就可以了。

l2i.download();

最后,你可以把这些都放到TamperMonkey中,使它成为一个扩展。

推荐文章

user3425506 · 没有互联网连接无法获得PWA

10 月前

sunics · jQuery在ul中查找li元素

1 年前

Marlon · 在Navigationextras中传递大数据router.navigation Angular 16导致Firefox错误

1 年前

Curious66 · 如何在谷歌会议中捕获传入的音频流

1 年前

Tricotou · $.get(code_url)执行返回的代码,不使用eval(),也不将其附加到DOM。jQuery安全性失败?

1 年前

ÙØÙØ¯ Ø§ÙÙÙ · 使用sendMessage功能时从Chrome扩展程序获取数据的延迟

1 年前

Patrick Potocny · Next.js 14草稿模式在iframe中不起作用(无头CMS预览)

1 年前

Vrushabh Ranpariya · 谷歌Chrome-开发工具-网络选项卡:设计更新

1 年前

Johnny Chen · 相同的字体在chrome和firefox中的显示方式不同

1 年前

Alexander Mills · Flutter不将Chrome识别为“web”,反之亦然

1 年前