$（document）.readyまたはgenderフィルタのいずれかから関数を呼び出します

Question

私はパラメータとしてgenderをとるcreatetableという関数を持っています。最初の時間ページが読み込まれたら、$(document).readyに既定の性別の値でその関数を実行させ、後で性別フィルターを選択すると、その値でcreatetable関数を実行します。

$(document).ready(function() { 
    var gender = 'all'; 

    $('.ranges ul li').click(function() { 
    $(".dropdown-toggle span").text($(this).text()); 
    $('.ranges ul li').removeClass("active"); 
    $(this).addClass("active"); 
    switch ($(this).text()) { 
     case 'All': 
     gender = 'all'; 
     break; 
     case 'Female': 
     gender = 'f'; 
     break; 
     case 'Male': 
     gender = 'm'; 
     break; 
     case 'Not Specified': 
     gender = 'none'; 
     break; 
     default: 
     gender = 'all' 
    } 
    createtable(gender); 
    }); 

    createtable(gender); 
}); 

createtableは$(document).readyスコープ自体で定義された関数である：以下のコードです。問題は、初めてページが読み込まれたときに、createtable関数が1回実行されることですが、フィルタを使用してジェンダーを変更すると、2回実行されます。

Answer 1

あなたは要素li` `入れ子になっているか、イベントpropagtion

$(document).ready(function() { 
    var gender = 'all'; 

    $('.ranges ul li').click(function(event) { 
    event.stopPropagation(); //stop bubble up 
    $(".dropdown-toggle span").text($(this).text()); 
    $('.ranges ul li').removeClass("active"); 
    $(this).addClass("active"); 
    switch ($(this).text()) { 
     case 'All': 
     gender = 'all'; 
     break; 
     case 'Female': 
     gender = 'f'; 
     break; 
     case 'Male': 
     gender = 'm'; 
     break; 
     case 'Not Specified': 
     gender = 'none'; 
     break; 
     default: 
     gender = 'all' 
    } 
    createtable(gender); 
    }); 

    createtable(gender); 
});