Question

我们试图找到动态的类名，但是当我们点击其他链接时我们只找到第一个div名称。

js代码： -

$(document).ready(function(){
$('#foot-map .maplink a').on('click', function(){
    var mapFlag = $(this).closest('#foot-map').find('.map-area div').attr('class');

    alert(mapFlag);

});

});

请在此链接中找到完整代码： - Jsfiddle

Answer 1

你只看到第一个div的值的原因是因为jQuery集合中有多个元素，并且在该集合上调用attr()将只返回第一个。

要实现您的要求，您可以在data元素上添加额外的<a>属性，该属性可用于定位与.map-area相关的特定a div，像这样的东西：

＆＃13;

$(document).ready(function() {
  $('#foot-map .maplink a').on('click', function(e) {
    e.preventDefault();
    var target = $(this).data('target');
    var mapFlag = $(this).closest('#foot-map').find('.map-area .' + target).attr('class');
    alert(mapFlag);
  });
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="foot-map">
  <ul class="maplink">
    <li><a id="uktabfoot" data-target="uk" class="active" href="#">UK</a></li>
    <li><a id="maltatabfoot" data-target="malta" href="#">MALTA</a></li>
    <li><a id="indiatabfoot" data-target="india" href="#">INDIA</a></li>
  </ul>
  <div class="map-area">
    <div class="uk map-hover">
      <a href="#"><b></b></a>
      <span class="flag">United Kingdom</span>
    </div>
    <div class="malta">
      <a href="¢"><b></b></a>
      <span class="flag">Malta</span>
    </div>
    <div class="india">
      <a href="#"><b></b></a>
      <span class="flag">India</span>
    </div>
    <div class="china">
      <a href="#"><b></b></a>
      <span class="flag">China</span>
    </div>
  </div>
</div>

＆＃13;

请注意，将javascript:置于href属性中并不理想。如果您不希望通过点击该元素来影响该网址，请将href设为#并使用return false阻止该事件，或者最好通过调用{{1在凸起的事件上。

谁找到动态类名

1 个答案: