添加侦听器以跨越内容更改

时间:2014-02-10 15:43:33

标签: javascript jquery

我有一段简短的代码片段,我希望每次下拉时都会运行这些代码,从ul(用于CSS目的)改变其值。

<span class="persons">5 personer</span>
<ul class="dropdown">
    <li><a href="#">5 personer</a></li>
    <li><a href="#">6 personer</a></li>
    <li class="goodprice"><a href="#">7 personer (mer prisvärt)</a></li>
    <li><a href="#">8 personer</a></li>
    <li class="goodprice"><a href="#">9 personer (mer prisvärt)</a></li>
    <li><a href="#">10 personer</a></li>
    <li class="goodprice"><a href="#">11 personer (mer prisvärt)</a></li>
</ul>

这是我的jQuery:

var persons = $('.persons').text();

if (persons == "5 personer" || persons == "6 personer" || persons == "7 personer (mer prisvärt)") {
    $('#boattype1').show();
    $('#boattype2').show();
    $('#boattype3').hide();
} else if (persons == "8 personer" || persons == "9 personer (mer prisvärt)") {
    $('#boattype1').show();
    $('#boattype2').hide();
    $('#boattype3').show();
}

所以我需要的是从ul中选择新内容后触发的JS代码。我试图添加$('ul a').click(function() {});$('span').change(function() {});之类的内容而没有任何结果,所以我非常需要你的帮助才能解决这个问题,希望是小问题。

1 个答案:

答案 0 :(得分:4)

一个span本身没有change事件,但没有什么可以阻止你手动触发它,然后任何对该事件的订阅都将触发:

$(function(){
    $('.persons').change(function() {
       console.log('span changed to ' + $(this).text());
    });

    $('ul li a').click(function(){
        $('.persons').text($(this).text()).trigger('change');
    });
});

实例:http://jsfiddle.net/djB83/