पेज लोड

Question

पर जावास्क्रिप्ट फ़ंक्शन को कॉल किया जा रहा है, जब मैं इसे नहीं चाहता, तो मेरा जावास्क्रिप्ट switchDiv फ़ंक्शन पेज लोड पर कॉल किया जा रहा है। जब इसे बुलाया जाता है, तो यह स्विच स्टेटमेंट के माध्यम से जाता है और डिफ़ॉल्ट को छोड़कर, प्रत्येक मामले में करता है। क्या किसी को पता है कि इसे कैसे ठीक करते हैं?

$(document).ready(function() { 
$("#be-button").on("click", switchDiv(1)); 
$("#red-button").on("click", switchDiv(2)); 
$("#green-button").on("click", switchDiv(3)); 
$("#blue-button").on("click", switchDiv(4)); 
}); 

var switchDiv = function (mapNum) { 
    console.log(mapNum); 
    switch(mapNum) { 
    case 1: 
     $("#be-data").show(); 
     $("#red-data").hide(); 
     $("#green-data").hide(); 
     $("#blue-data").hide(); 
     break; 
    case 2: 
     $("#be-data").hide(); 
     $("#red-data").show(); 
     $("#green-data").hide(); 
     $("blue-data").hide(); 
     break; 
    case 3: 
     $("#be-data").hide(); 
     $("#red-data").hide(); 
     $("#green-data").show(); 
     $("blue-data").hide(); 
     break; 
    case 4: 
     $("#be-data").hide(); 
     $("#red-data").hide(); 
     $("#green-data").hide(); 
     $("blue-data").show(); 
     break; 
    default: 
     $("#be-data").show(); 
     $("#red-data").hide(); 
     $("#green-data").hide(); 
     $("#blue-data").hide(); 
} 
} 

Answer 1

आप पैरामीटर के रूप में उन्हें पारित करने के बजाय कार्यों को निष्पादित कर रहे हैं। एक पैरामीटर है

function myFunc() { } 
$("selector").on("click", myFunc()); // execute "myFunc" -- its return value is the handler 

बेशक

, तो आप इस मामले में पहले उपयोग नहीं कर सकते, switchDiv ही के बाद से:

function myFunc() { } 
$("selector").on("click", myFunc); // "myFunc" is the handler 

और एक समारोह को क्रियान्वित: यानी, आप एक समारोह गुजर के बीच अंतर करने की जरूरत है ।

:

$("#be-button").on("click", function() { switchDiv(1); }); 

आप इस कई बार कर रहे हैं के बाद से, हालांकि, आप शायद एक सहायक समारोह "createHandler" या कुछ और की तरह चाहते हैं: एक तरीका यह चारों ओर पाने के लिए एक गुमनाम समारोह में लपेट के लिए है

function createHandler(num) { 
    return function() { switchDiv(num); }; 
} 

$("#be-button").on("click", createHandler(1)); 
$("#red-button").on("click", createHandler(2)); 
// etc