javascript - 在点击处理函数上重写 jQuery

Question

我是 jQuery 的新手，我希望是否有一种方法可以覆盖现有的点击函数。

代码如下:

$('.woo-star-rating').on('click', function() {
    $('.woo-star-rating-filled').width( $(this).attr('data-rating') * 25 )
});

我想在我自己的 .js 文件中将数字 25 更改为 21。

$('.woo-star-rating').on('click', function() {
    $('.woo-star-rating-filled').width( $(this).attr('data-rating') * 21 )
});

Answer 1

您可以使用 .off() 删除现有的 click 事件处理程序方法添加新的点击事件。

var $rating = $('.woo-star-rating');

$rating.off('click');
$rating.on('click', function() {
    $('.woo-star-rating-filled').width( $(this).attr('data-rating') * 21 )
});

这可以链接成:

$('.woo-star-rating').off('click').on('click', function() {
    $('.woo-star-rating-filled').width( $(this).attr('data-rating') * 21 )
});

这是一个工作示例:

// add junk event
$('#test-button').on('click', function() {
  console.log('first button click');
});

// remove first event
$('#test-button').off('click');

// add new event, only this will fire on click
$('#test-button').on('click', function() {
  console.log('second button click');
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button id="test-button">Test Button</button>