在jQuery中使用带有符号的html（）方法

当您仅看到更新的标题时，我想创建一个更新列表 - 除非您在标题附近点击一个向下指向的标签，然后您将看到完整更新信息+指向下陷的traingle将变成指向特定的traingle。在点击指向的Traingle后，你将只能看到更新的标题+三角形将向下指向。在jQuery中使用带有符号的html（）方法

所以我写了下面的代码，以实现一个：

HTML：

<!DOCTYPE html> 
<html> 
<head> 
    <meta charset="utf-8" /> 
    <script type="text/javascript" src="script.js"></script> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> 
</head> 

<script> 
    arrowsUpdate(); 
</script> 


<p> 
<span class="down-arrow">&#9660;</span> 
<br> 
<span class="hidden-text">update 1</span> 
</p> 

<p> 
<span class="down-arrow">&#9660;</span> 
<br> 
<span class="hidden-text">update 2</span> 
</p> 


</body> 
</html>

JS：

function arrowsUpdate(){ 
    $(document).ready(function(){ 
     $(".down-arrow").each(function(){ 
      $(this).click(function(){ 
       $(this).siblings(".hidden-text").slideToggle(0,"linear"); 
       if($(this).html()=="&#9660;") 
        $(this).html("&#9650;"); 
       else 
        $(this).html("&#9660;");    
      });   
     }); 
    }); 
}

这段代码的问题是指向三角形八方通向下的。看起来if声明有问题，它总是返回false。
我不明白为什么会发生这种情况，特别是当设置的代码行（$(this).html("▲");和$(this).html("▼");）按预期工作时（尝试在不同的页面中使用这些代码行并且它可行）。

为什么条件$(this).html()=="▼"返回allways false，如果this的内容是▼？

来源

2016-09-22 John

@Jonathan如果它总是返回false，从'=='更改为'==='不会有帮助。 '==='是更多**歧视，而不是更少。 – Barmar

您可以使用实体设置html，但是当它返回时，它将不再是实体而是字符，这就是实体的工作方式。

更清晰，这个线路出现故障，每次

if($(this).html()=="&#9660;")

因为$(this).html()绝不会返回一个实体，但性格▼相反，证明...

document.body.innerHTML = '&#9660;'; 
 
console.log(document.body.innerHTML)

一个更简单的方法来创建切换功能，而不依赖于标记，会只是使用国旗

function arrowsUpdate() { 
    $(".down-arrow").on('click', function() { 
    $(this).siblings(".hidden-text").slideToggle(0, "linear"); 

    var flag = $(this).data('flag'); 

    $(this).html(flag ? "&#9660;" : "&#9650;").data('flag', !flag); 
    }); 
}

来源

2016-09-22 20:09:18 adeneo

在jQuery中使用带有符号的html（）方法

回答

相关问题