Question

我试图根据count的值显示两个不同的代码位。

例如，如果count等于1，我想显示以下代码：

<h5>person has visited</h5>

如果它更多，我想显示

<h5>people have visited</h5>

这是我目前的代码：

<h5 class="visitor-count count">{{ $place->visitors->count()}}</h5>
<h5 class="visitor-count count-text">people have visited</h5>

$('.visit').on('click', function(event){
    event.preventDefault();
    var buttonToChange = $(this);
    var $this = $(this);

    $.ajax({})
    .done(function() {
        if(buttonToChange.hasClass('btn-visited')){
            buttonToChange.addClass('btn-not-visited');
            buttonToChange.removeClass('btn-visited');
            buttonToChange.html('Visited?');
            count = $this.siblings('.count');
            count.html(parseInt(count.html()) - 1);
        } else {
            buttonToChange.addClass('btn-visited');
            buttonToChange.removeClass('btn-not-visited');
            buttonToChange.html("I've Visited <i class='fas fa-check'>");
            count = $this.siblings('.count');
            count.html(parseInt(count.html()) +1);
        }
    });
});

Answer 1

我不确定你在这里尝试做什么，但是：

我根据你的if / else
我声明了count变量，该变量未被声明。
我硬编码了2个以前的访问者而不是PHP代码。你将不得不改变它。
我添加了一个简单的if / else块来测试计数是否等于1并以你想要的方式更改消息：

例如，如果count等于1，我想显示以下代码：

<h5>person has visited</h5>

我删除了$ .ajax电话，因为它没有任何用途。

它的行为方式是否符合您的要求？

＆＃13;

$('.visit').on('click', function(event) {
    event.preventDefault();
    var buttonToChange = $(this);
    var $this = $(this);
    var count;

    $.ajax('http://www.google.fr')
        .done(function() {
            if (buttonToChange.hasClass('btn-visited')) {
                buttonToChange.addClass('btn-not-visited');
                buttonToChange.removeClass('btn-visited');
                buttonToChange.html('Visited?');
                count = $this.siblings('.count');
                count.html(parseInt(count.html()) - 1);
            } else {
                buttonToChange.addClass('btn-visited');
                buttonToChange.removeClass('btn-not-visited');
                buttonToChange.html("I've Visited <i class='fas fa-check'>");
                count = $this.siblings('.count');
                count.html(parseInt(count.html()) + 1);
            }

            // simple if / else to change the text in 'count-text' depending on the value of 'count'
            if (parseInt(count.html()) === 1) {
                $(".count-text").html("person has visited");
            } else {
                $(".count-text").html("people has visited");
            }
        });

});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
<button type="button" class="visit btn-visited">Visit</button>
<h5 class="visitor-count count">2</h5>
<h5 class="visitor-count count-text">people have visited </h5>

＆＃13;

简单如果在计数器上显示不同的h5

1 个答案: