javascript - jQuery - 比较两个值并显示或隐藏 div

Question

https://jsfiddle.net/6k6ehnn2/

你好，我需要使，如果值大于或等于 1000.00 函数显示 div .boleto，但不显示...比较两个字符串时我哪里出错了？

<span class="valor">R$ 200,00</span>
<div class="boleto">pagamento em boleto</div>    

$(function(){
    var valorMinimoBoleto = '1000,00';
    var valorTratado = $(".valor").html().replace('R$ ','');
    var valorBoleto = valorTratado;
    if ( valorBoleto >= valorMinimoBoleto ) {           
        console.log('valor exibe boleto');
    } else {
        $('.boleto').hide();
        console.log('valor não exibe boleto');
    };    
});

Answer 1

这是因为 valorMinimoBoleto 和 valorBoleto 都是字符串，因此您的 if 条件在那里不起作用。

因此，首先使用 number() 方法将它们转换为数字，如下所示

$(function(){
    var valorMinimoBoleto = 100000;
    var	valorTratado = $(".valor").html().replace('R$ ','');
    var	valorBoleto = Number(valorTratado);
    	if ( valorBoleto >= valorMinimoBoleto ) { 
    		console.log('valor exibe boleto');
    	} else {
    		$('.boleto').hide();
    		console.log('valor não exibe boleto');
    	};    
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<span class="valor">R$ 200,00</span>
<div class="boleto">pagamento em boleto</div>

正如 LinkinTED 22 所说，我们还可以使用 toggle() 函数代替 if..else，如下所示:

$(function(){
    var valorMinimoBoleto = 100000;
    var	valorTratado = $(".valor").html().replace('R$ ','');
    var	valorBoleto = Number(valorTratado);
    	$('.boleto').toggle( valorBoleto >= valorMinimoBoleto );
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<span class="valor">R$ 200,00</span>
<div class="boleto">pagamento em boleto</div>

希望有帮助:)