Question

确定改变了我的代码：

      <div class="a" id="mySidenav">
         <a href="javascript:void(0)" class="closebtn" onclick="closeNav()">X</a>
         <a href="#" id="tname">Number:</a>
         <a href="#" id="d1"></a>
         <a href="#" id="d2"></a>
      </div>
      <map class="b" name="mymap" id="map">
         <area shape="circle" coords="67,420,20" onclick="openNav(this)" alt="5" />
         <area shape="circle" coords="184,384,19" onclick="openNav(this)" alt="6" />
      </map>
     function openNav(element){
     $('#mySidenav').css("width", "250px");
     $('#image').css("marginLeft", "250px");
     var alt = $(element).attr("alt");
       $('#tname').text(alt);
     }

我的文件夹名为＆＃34; 5＆＃34;和＆＃34; 6＆＃34;等等。每个文件夹都有1.html 2.html <title>PersonName</title>，如果我点击图片地图，alt = 5，我想得到＆＃39; 5 / 1.html＆＃39; <title>上显示"id=d1"值，它应该成为该html的链接。尝试了这个，但没有工作，似乎我犯了语法错误

$.get('1.html'), openNav(result){
    var obj = $(result).find('title');
    $(this).append($('#d1').text(obj.html()));

Answer 1

您可以使用带有.getAttribute("alt")的纯JavaScript或带有.attr("alt")的jQuery来选择属性。但是，您需要先选择正确的元素。你可以这样做，例如使用带有$("#map area")的jQuery。但是，在函数中直接传递元素更容易。

HTML：

<map class="b" name="mymap" id="map">
   <area shape="circle" coords="67,420,20" onclick="openNav(this)" alt="5" />
   <area shape="circle" coords="184,384,19" onclick="openNav(this)" alt="6" />
</map>

JavaScript的：

function openNav(element) {
   var alt = element.getAttribute("alt");
   document.getElementById("tname").innerHTML = alt;
}

// or with jQuery
function openNav(element) {
   var alt = $(element).attr("alt");
   $("#tname").text(alt);
}

编辑后问题的答案：

正确的解决方案是在该区域设置点击监听器。在这个clicklistener中，你可以像这样创建整个逻辑。

首先，从HTML文档中删除每个onclick=""。

然后，使用此JavaScript代码段：

$("#map area").click(function() {
    var alt = $(this).attr("alt");
    var address1 = alt + "/1.html";
    var address2 = alt + "/2.html";

    $.get({
        url: address1,
        success: function(result) {
            var title = $.parseHTML(result).find("title").text();
            $("#d1").text(title).attr("href", address1);
        }
    });
    $.get({
        url: address2,
        success: function(result) {
            var title = $.parseHTML(result).find("title").text();
            $("#d2").text(title).attr("href", address2);
        }
    });
});

当然有改进的余地（例如DRY概念等）。

如何获取所选图像映射alt值？

1 个答案: