HTML，可单击的图表，单击时会显示框

HTML, clickable diagram with boxes appearing on click

本文关键字：单击 显示 HTML      更新时间：2023-09-26

我正在尝试构建一个可点击的人图，当您单击一个人的肢体时，该人旁边会出现一个文本框，解释所选肢体。

人就在左边，盒子在右边堆放。选择肢体后，它显示为突出显示。

最好的方法是什么？我应该使用 jQuery 切换吗？

$( "#effect" ).toggle( selectedEffect, options, 500 );

假设您的人员图ID为"人图"。您还应该为希望文本框显示的每个元素添加一个"limb"类。

然后，我将使用 jQuery 绑定 http://api.jquery.com/bind/绑定 jQuery 事件处理程序。然后，使用 jQuery 切换切换文本框。至于如何确定要在文本框内显示哪些文本，有几种不同的方法可以实现。一种简单的方法是为您的所有肢体提供一个 title 属性，然后检索单击的肢体的标题并将其设置为文本框中的文本。

例： 

$( "#person-diagram .limb" ).bind( "click", function() {
  $("#textbox" ).toggle();
});

这应该让你开始:)

相关文章：