使用jQuery实现点击时高亮显示代码的功能，你首先需要为要高亮的元素（比如一个``标签或``标签中的文本）设置一些基本的样式。然后，通过jQuery的`.click()`事件监听器来切换这些元素的样式，从而实现高亮效果。
以下是一个简单的示例：
首先，定义一些基本的CSS样式，用于表示高亮状态和非高亮状态：
/* 非高亮状态 */
.code {
background-color: #f8f9fa; /* 浅灰色背景 */
padding: 10px; /* 内边距 */
border: 1px solid #ddd; /* 边框 */
border-radius: 5px; /* 边框圆角 */
}
/* 高亮状态 */
.code.highlight {
background-color: #ffecb3; /* 浅黄色高亮背景 */
}
然后，在HTML中，确保你的代码块有`.code`类：
<pre class="code">
<code>
// 这里是你的代码
function example() {
console.log("Hello, world!");
}
</code>
</pre>
最后，使用jQuery来添加点击事件监听器，以切换`.highlight`类：
$(document).ready(function() {
$('.code').click(function() {
$(this).toggleClass('highlight'); // 切换.highlight类以实现高亮
});
});
在这段jQuery代码中，我们首先等待文档加载完成（`$(document).ready(function() {...})`），然后为所有具有`.code`类的元素添加一个点击事件监听器。当这些元素被点击时，`.toggleClass('highlight')`方法会被调用，该方法会切换元素上的`.highlight`类。如果元素已经拥有`.highlight`类，它会被移除；如果没有，则会被添加。这样就实现了点击时的高亮显示效果。