jQueryは、値に応じてaria-expanded属性を変更します。

Question

現在の状態に応じて、aria-expanded属性を変更したい項目があります。

それは本当のOK変更されますが、何らかの理由で第二のクリックでfalseに変更されません：

HTML

<li aria-expanded=false>hey</li> 

jQueryの

$("li").on("click", function(e) { 
    var menuItem = $(e.currentTarget); 

    if (menuItem.attr("aria-expanded") == true) { 
      $(this).attr("aria-expanded", false); 
    } else { 
      $(this).attr("aria-expanded", true); 
    } 
    return false; 
}); 

https://codepen.io/anon/pen/jLYRpg

Answer 1

HTML属性は文字列なので、01の文字列バージョンを使用する必要がありますおよびfalse。

$(function() { 
 
    $('li').on('click', function (e) { 
 
     var menuItem = $(e.currentTarget); 
 

 
     if (menuItem.attr('aria-expanded') === 'true') { 
 
      $(this).attr('aria-expanded', 'false'); 
 
     } else { 
 
      $(this).attr('aria-expanded', 'true'); 
 
     } 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<li aria-expanded="false">hey</li>