Question

我是jQuery和html的新手，我正在尝试在我的网页上创建一个打印按钮。我得到了小打印图像，但点击图像什么也没做。当鼠标悬停在图像上时，我的光标甚至不会改变。我有一个jQuery函数，应该处理打印的逻辑。谁能看到我做错了什么？

以下是我目前的代码：

<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<link rel="stylesheet" href="PoliticsHTML_CSS.css" type="text/css"/>
<link rel="stylesheet" href="http://yui.yahooapis.com/pure/0.5.0/pure-min.css">
<title>Display HTML Table</title>

<script>
$('.printMe').click(function(){
     window.print();
});
</script>

</head>
<body>

<?php
  error_reporting(E_ALL); 
  ini_set('display_errors', 1);

$con=mysqli_connect("******","*****","***", "***");
// Check connection
if (mysqli_connect_errno()) {
  echo "Failed to connect to MySQL: " . mysqli_connect_error();
}


$sql = "SELECT * FROM PoliticsPoll";
$result = mysqli_query($con, $sql);

echo "<table border='1' class='pure-table-bordered'>
<tr>
<th>ID</th>
<th>Politics Poll Question 1</th>
<th>Politics Poll Question 2</th>
<th>Politics Poll Question 3</th>
<th>Politics Poll Question 4</th>
<th>Politics Poll Question 5</th>
<th>Politics Poll Question 6</th>
<th>Politics Poll Question 7</th>
<th>Politics Poll Question 8</th>
<th>Politics Poll Question 9</th>
<th>Politics Poll Question 10</th>
</tr>";

echo "</table>";

mysqli_close($con);
?>

<img src="print.png" class="printMe" alt="Print" title="Print"></a>

</body>
</html>

Answer 1

将“click”处理程序添加到不存在的DOM元素（现在）。在<script>之后和<img>之前移动</body>。

Answer 2

很可能是因为printMe元素还没有存在，你需要等到它已经加载：

$(document).ready(function() {
   $('.printMe').click(function(){
     window.print();
  });
});

告诉它等到文档加载后绑定事件处理程序。

Answer 3

您不需要为此使用Jquery，请尝试将打印按钮更改为：

<script>
    function Print () {
        window.print()
    }
</script>

<img src="print.png" class="printMe" onClick="Print()" alt="Print" title="Print"></a>

网页打印按钮不起作用

3 个答案: