jQuery在Firefox和IE 11中无法正常运行

Question

这是代码链接： jsfiddle演示

HTML代码：

<div class="first">
<!-- Part one -->
<div class="acord_col">
    <div class="img_class" id="exist_site"></div>
    <div class="intro_text">
    </div>
</div>  
</div>

<div class='total_cost'>
<h1>Your Total Cost is: $<span class="cost_number">0</span><span class="cost_per_page no_display"> + 50/Page</span></h1>
</div>

Java脚本

jQuery(document).ready(function() {
var total_price = 0;

jQuery("#exist_site").click(function() {
            var bg = jQuery(this).css('background');
            var check_string = 'yes.png';

            if (bg.indexOf(check_string) > -1) {
                jQuery(this).css({
                    'background': 'url("http://www.itechinstant.com/wp-content/uploads/2014/06/home.png")',
                    'background-size': 'cover'
                })
                total_price -= 200;
                jQuery('.cost_number').empty().append(total_price);

                jQuery("#exist_site").hover(function() {
                    jQuery(this).css({
                        'background': 'url("http://www.itechinstant.com/wp-content/uploads/2014/06/home_h.png)',
                        'background-size' : 'cover'
                    })
                })

                // Change the status of detected value
                var boolean_next = parseInt(jQuery('.boolean_goNext').text());
                boolean_next -= 1;
                jQuery('.boolean_goNext').empty().append(boolean_next);

            } else {
                jQuery(this).css({
                    'background': 'url("http://www.itechinstant.com/wp-content/uploads/2014/06/yes.png")',
                    'background-size': 'cover'
                })
                total_price += 200;
                jQuery('.cost_number').empty().append(total_price);

                // Change the status of detected value
                var boolean_next = parseInt(jQuery('.boolean_goNext').text());
                boolean_next += 1;
                jQuery('.boolean_goNext').empty().append(boolean_next);

            }

        })
})

我实际上是使用jquery编写价格系统。

问题是它在谷歌浏览器中工作正常。 但不是在Firefox和IE11中。

当我单击周期时，它将增加成本，再次单击它应取消选择周期并减去相同的成本。 在chrome中一切正常。 但是，为什么在firefox和IE11中，无论我单击多少次，成本都会不断增加？

Answer 1

如果您阅读.css（）jQuery文档，则会显示：

尽管某些浏览器可以使用速记CSS属性（例如，边距，背景，边框），但仍不能保证对其进行检索。

我们可以做的是，检查background-image属性。

var bg = jQuery(this).css('background-image');

更新小提琴