Jquery：如何从内容中获取属性

Question

我无法从内容中获取元素并在用户单击鼠标时显示它。

基本上，我们正在制作一个失物招领网站，当用户点击特定位置时，我们希望出现一个带有该位置名称的文本框。

我们遇到了一个问题，即什么都没有输出，或者 url 很长，或者有时是 [Object object]

content: <area id="AF' class="location" title="Anderson Field" alt="Anderson Field">

我们有多个类名相同但ID不同的区域属性。我们不想繁琐地说 if (id == "AF") print "Anderson Field"，而是想根据鼠标点击自动获取值

我们的事件处理程序：

$("href").click("click", function(){

$("#textBox").val(myfunction();

function myfunction()
{
  return $("input").val(title);
}

所以我们的 myfunction 实际上是在获取属性的值，但我们的问题是我们没有正确获取它。要么什么都没有显示，一个长的 url，或者 [Object object]

Answer 1

您可以将事件附加到地图内的“area”元素，并通过"this" keyword 从 jQuery 事件访问（“area”元素的）元素属性。

假设您的地图名为“planetmap”，例如，它可能是：

$("map[name=planetmap] area").on("click", function(){
    $("#textBox").val($(this).attr('title')).show();
    return false;
});

其中 textBox 是您要显示的隐藏输入。您可以现场观看：

https://jsfiddle.net/zetxek/rs03e3zd/5/

如果您只想设置输入的值并将其显示在代码的其他部分，您可以省略“显示”部分：

$("#textBox").val($(this).attr('title'));