如何将html实体与jQuery进行比较
我有以下HTML代码：
⇑Header title
每次用户点击span标记时，我都希望在向上箭头和向下箭头之间切换。
function expandCollapse(id) { var arrow = $("#"+id+" span").html(); // I have tried with .text() too if(arrow == "⇓") { $("#"+id+" span").html("⇑"); } else { $("#"+id+" span").html("⇓"); } }
我的function始终是其他路径。 如果我做了一个javacript： arrow变量的警告我得到的html实体表示为箭头。 如何告诉jQuery将arrow变量解释为字符串而不是html。
解析HTML时，JQuery在DOM中看到的是UPWARDS DOUBLE ARROW （“ UPWARDS DOUBLE ARROW ”），而不是实体引用。 因此，在您的Javascript代码中，您应该测试"\u21d1"或"\u21d1" 。 此外，您需要更改要切换到的内容：
function expandCollapse(id) { var arrow = $("#"+id+" span").html(); if(arrow == "\u21d1") { $("#"+id+" span").html("\u21d3"); } else { $("#"+id+" span").html("\u21d1"); } }
如果您对arrow发出警报，它会返回什么？ 它是否返回与您匹配的确切字符串？ 如果你得到实际的字符'⇓'和'⇑'你可能需要将它与"\u21D1"和"\u21D3"匹配。
此外，您可能想尝试⇑ 和⇓ 因为并非所有浏览器都支持这些实体
更新 ：这是一个完整的例子： http ： //jsbin.com/edogop/3/edit#html,live
window.expandCollapse = function (id) { var $arrowSpan = $("#" + id + " span"), arrowCharCode = $arrowSpan.text().charCodeAt(0); // 8659 is the unicode value of the html entity if (arrowCharCode === 8659) { $arrowSpan.html("⇑"); } else { $arrowSpan.html("⇓"); } // one liner: //$("#" + id + " span").html( ($("#" + id + " span").text().charCodeAt(0) === 8659) ? "⇑" : "⇓" ); };
使用类来指示跨度的当前状态。 HTML可能看起来像这样
⇑Header title
然后在你的JavaScript中
$( '.upArrow, .downArrow' ).click( function( span ) { if ( span.hasClass( 'upArrow' ) ) span.text( "⇓" ); else span.text( "⇑" ); span.toggleClass( 'upArrow' ); span.toggleClass( 'downArrow' ); } );
这可能不是最好的方法，但它应该有效。 没有测试它很难
查看.toggle（）效果。
这是我之前玩的类似的东西。
HTML：
Hello World!
脚本：
$("#myStatic").bind("click", function(){ $("#myNewTxt").val($("#myStatic").text()); $("#myStatic,#myEdit").toggle(); }); $("#myOk").click(function(){ $("#myStatic").text($("#myNewTxt").val()); $("#myStatic,#myEdit").toggle(); }); $("#myX").click(function(){ $("#myStatic,#myEdit").toggle(); });
也许你没有得到完全匹配，因为浏览器低于实体或其他东西。 尝试使用克拉（^）和小写“v”进行测试。
编辑 – 我的第一个理论是完全错误的。