javascript - 使用 jQuery 单击输入单选按钮时更改跨度的文本值

Question

我想要文字“评分!” (62)' 在 'rate' 类中更改为 'Rate! (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 函数开头缺少 $。和 ); 从末尾开始。