2011-11-11 7 views
15

जब कोई चयन विकल्प बदलता है तो मैं कुल मूल्य अपडेट करने का प्रयास कर रहा हूं।मेरा कॉफीस्क्रिप्ट क्यों नहीं होगा यदि/else कथन काम करता है?

<select id="payment_talks_purchased" name="payment[talks_purchased]"> 
    <option value="1">One</option> 
    <option value="2">Three</option> 
</select> 

यह jQuery मैं उपयोग कर रहा हूँ है:

jQuery(document).ready(function() { 
    var price = $(".total-price span.price") 
    var save = $(".savings") 
    $("#payment_talks_purchased").change(function() { 
    var selection = $("#payment_talks_purchased").val() 
    if (selection == 2) { 
     price.html("$12"); 
     save.css("visibility", "visible"); 
    } else if (selection == 1) { 
     price.html("$5"); 
     save.css("visibility", "hidden"); 
    } 
    }); 
}); 

यह पूरी तरह से काम करता है यहाँ का चयन तत्व मैं उपयोग कर रहा हूँ है। यह कीमत $ 12 में बदलता है और छूट संदेश दिखाता है। यदि मैं चयन विकल्प को एक/1 पर वापस बदलता हूं, तो यह पाठ को $ 5 में बदल देता है और छूट संदेश हटा देता है।

मैंने इसे कॉफीस्क्रिप्ट में परिवर्तित कर दिया लेकिन यह केवल तभी काम करता है जब मैं पहला परिवर्तन करता हूं। कीमत अद्यतन है। हालांकि, जब मैं इसे विकल्प 1 पर वापस बदलने की कोशिश करता हूं, तो यह अपडेट नहीं होता है।

jQuery -> 
    price = $(".total-price span.price") 
    save = $(".savings") 
    select = $("#payment_talks_purchased") 
    select.change -> 
    selection = select.val() 
    if selection = 2 
     price.html "$12" 
     return save.css "visibility", "visible" 
    else if selection = 1 
     price.html "$5" 
     return save.css "visibility", "hidden" 

मैं इस पर घंटों तक काम कर रहा हूं और अपने wits अंत में हूं। किसी भी तरह की सहायता का स्वागत किया जाएगा।

उत्तर

26

आपका selection = 1 अपने if बयान के अंदर (अभी भी) CoffeeScript में एक काम, आप तुलना के लिए == उपयोग करने की आवश्यकता है। इस प्रयास करें:

jQuery -> 
    price = $(".total-price span.price") 
    save = $(".savings") 
    select = $("#payment_talks_purchased") 
    select.change -> 
    selection = select.val() 
    if selection == '2' 
     price.html "$12" 
     return save.css "visibility", "visible" 
    else if selection == '1' 
     price.html "$5" 
     return save.css "visibility", "hidden" 

इसके अलावा, == is converted to === ताकि आप तार के खिलाफ तुलना करने के लिए जब तक आप एक नंबर selection = +select.val() या parseInt(select.val(), 10) (इस कास्टिंग चाल के लिए Trevor Burnham करने के लिए धन्यवाद) का उपयोग करने के लिए अपने मूल्य "डाली" करना चाहते हैं चाहता हूँ।

+4

बिल्कुल सही। यदि आप फॉर्म इनपुट को किसी संख्या में रूपांतरित करना चाहते हैं तो 'चयन = + select.val() 'का उपयोग करें। –

+0

आपकी मदद के लिए बहुत बहुत धन्यवाद। वह चाल है। –

+0

तुलना के लिए 'is' पसंद नहीं है, जब तक कि आप स्पष्ट रूप से टाइप जबरन ट्रिगर नहीं करना चाहते हैं? – jpmc26

6

आप स्विच का उपयोग कर सकते हैं:

switch selection 
    when '2' 
    price.html "$12" 
    save.css "visibility", "visible" 
    when '1' 
    price.html "$5" 
    save.css "visibility", "hidden" 

इसके अलावा, आप, दूर return ले जा सकते हैं, क्योंकि कार्यों हमेशा अपने अंतिम परिणाम प्रदान करेंगे।

1

यहां मेरा 50 सेंट है। 2 चीजों पर विचार करें: यह सिर्फ मेरी साधारण राय है और यह दुनिया का सबसे अच्छा जवाब नहीं हो सकता है।

क) आप पहले से ही अगर बयान के अंदर एक वापसी, कोई जरूरत नहीं है, तो किसी और

jQuery -> 
price = $(".total-price span.price") 
save = $(".savings") 
select = $("#payment_talks_purchased") 
select.change -> 
    selection = select.val() 
    if selection == '2' 
     price.html "$12" 
     // Since you return here, you dont need any other "else if" 
     return save.css "visibility", "visible" 

    price.html "$5" 
    return save.css "visibility", "hidden" 

और कोई, IMHO, और कहते हैं, अगर नहीं करता है पठनीयता में सुधार। वापसी एक वापसी है। अवधि। यह उतना आसान है।

jQuery -> 
price = $(".total-price span.price") 
save = $(".savings") 
select = $("#payment_talks_purchased") 
select.change -> 
    selection = select.val() 
    // "ternary" coffee version (if then else) 
    price.html if selection == '2' then "$12" else "$5") 
    save.css "visibility" (if selection == '2' then "visible" else "hidden") 

लेकिन, सभी से बेहतर है IF, ELSE, स्विच और उन सभी क्रेप्स से छुटकारा पाएं। ओओपी सोचें और आपका कोड बेहतर हो रहा है। एक प्रारंभिक बिंदु हो सकता है:

options = [ 
      {price: '$12', visible:"visible"}, 
      {price: '$5', visible:"hidden"} 
      ]; 
jQuery -> 
    price = $(".total-price span.price") 
    save = $(".savings") 
    select = $("#payment_talks_purchased") 
    select.change -> 
       // If the val of your select was 0 and 1, you wouldnt need the (-1) part 
     selection = parseInt(select.val) -1 
       price.html options[selection].price 
       save.css "visibility" options[selection].visible 

तो, यह है। लगभग एक ही कोड, लेकिन एक बेहतर कार्यान्वयन (imho) के साथ। धन्यवाद।