Question

我希望文字'评价！（62）'在'率'类中改为'率！（63）'当用户点击其中一个输入无线电时。

困难在于我有很多'星''div，所以这个改变必须只发生在封闭的'星'div的下一个跨度后代。

   <div class="stars float-left">
    <div class="rating" style="width:99%"></div>
    <p><input type="radio" name="rating" id="star5" value="5"><label for="star5"></label><input type="radio" name="rating" id="star4" value="4"><label for="star4"></label><input type="radio" name="rating" id="star3" value="3"><label for="star3"></label><input type="radio" name="rating" id="star2" value="2"><label for="star2"></label><input type="radio" name="rating" id="star1" value="1"><label for="star1"></label>
    </p>
    <span class="rate">Rate! (62)</span>
</div>

我是jQuery的新手，这是我想到的，但它不起作用。我想我在路上混淆了几件事：

('.rating input:radio').click(function() {
    var str_rate = $(obj).closest('span').next().find('.rate');
    //TODO: parse the current value and add 1 to it
    $(str_rate).html(str);
}

有什么东西我完全不见了吗？

更新 This jsfiddle显示了直到现在考虑答案的进度，但仍然无法正常工作。

Answer 1

您的问题是您的选择器找到span，将其更改为：

$(obj).parents('.stars').find('.rate');

因此，我们获得了父stars元素，然后我们获得了关联的.rate span。

另请注意：您从$功能开始就错过了click。以及);的结尾。

Answer 2

您可以按如下方式更改费率：

    var rate_string = $(str_rate).text();
    var rate = parseInt(rate_string.substring(rate_string.indexOf("(") + 1,rate_string.indexOf(")")),10) + 1;
    $(str_rate).text("Rate! " + rate);

但请注意我的选择器有问题，必须修改它以获得跨区域。

汤姆以下是我所做的所有代码更改：

<div class="stars float-left">
<div class="rating" style="width:99%"></div>
<p>
    <input type="radio" name="rating" id="star5" value="5"><label for="star5"></label>
    <input type="radio" name="rating" id="star4" value="4"><label for="star4"></label>
    <input type="radio" name="rating" id="star3" value="3"><label for="star3"></label>
    <input type="radio" name="rating" id="star2" value="2"><label for="star2"></label>
    <input type="radio" name="rating" id="star1" value="1"><label for="star1"></label>
</p>
<span class="rate">Rate! (62)</span>

使用以下脚本

    $('input:radio').click(function (obj) {
    var str_rate = $(this).closest('div').find('span.rate');
    var rate_string = $(str_rate).text();
    var rate = parseInt(rate_string.substring(rate_string.indexOf("(") + 1,rate_string.indexOf(")")),10) + 1;
    $(str_rate).text("Rate! (" + rate + ")");
});

除了格式化之外，我认为我没有更改html。

Answer 3

如果您的选择器是正确的（str_rate），那么您可以通过var value = str_rate.val（）获取值（参见http://api.jquery.com/val/）。然后你可以通过.val（）方法再次将该值重新设置为元素，只是这次，传递新值，或者通过你正在使用的.html（）。

使用jQuery单击输入无线电时更改跨度的文本值

3 个答案: