简体   繁体   中英

Print Button does not work

The print button i have created for my webpage is not functioning. When i inspect the element, nothing seems to come out. Not one error

Here is my html code:

<button onclick = "printAddOrders()">Print New Orders</button>

And here is the javascript function code:

function printNewOrders(){
  window.print();
}

$(document).on("click", "#print-click", printNewOrders);

Attached here is also a link to my JSFiddle where i simulated the problem to make things more clear for the sake of exhibiting:

https://jsfiddle.net/poch_MENDOZA/7uwm8sd0/

You call printAddOrders() from your button. I think you mean to call printNewOrders()

You forgot to add the print-click id to the <button>

<button id="print-click" onclick="printAddOrders()">

And your function names does not coincide. You have printAddOrders in html and printNewOrders in js.

Here's a fork of your fiddle that is working.

Neither you have defined printNewOrders nor printAddOrders . With onclick you have attached printAddOrders but there is no function body.

Secondly there is no id print-click attached to any DOM element.

Your jsfiddle is not working as you have use $ but have not included jquery

Below is a cod snippet for opening print window on click of button. You dont need jquery here

HTML

<button onclick = "printAddOrders()" id ="print-click">Print New Orders</button>

JS

 function printAddOrders(){
  window.print();
}

jsfiddle without jquery

Snippet with jquery

HTML

// Note there is no onclick handler added since you are delegating the event to click of `print-click`
<button onclick = "" id ="print-click">Print New Orders</button>

JS

function printNewOrders(){
  window.print();
}
$(document).on("click", "#print-click", printNewOrders);

jsfiddle with jquery

尝试

<button onclick = "window.print()">Print New Orders</button>
<button onclick = "window.print();">Print New Orders</button>

That you want accomplish? Or you need more on that printing function?

Entire Code for your reference:

function printNewOrders() { window.print(); }

Thanks

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM