2016-01-21 179 views
2

这是fiddle,所以你可以看到我在说什么。如何使JavaScript写入价格基于输入?

基本上这是一个价格检查器,我需要使用Javascript才能显示一些值。

所以你可以看到我有div .offer,我有一个行动呼吁的提议。当用户加载页面时,div将显示“Please select a country”

按下“检查价格”后,将显示一个段落,其中包含一个价格和其下的黄色按钮。 所以,我的问题是,我该怎么做?我如何创建一个脚本来检查“to”和“from”这两个值,以显示适当的价格?例如,如果他从德国选择到美国,它应该显示0.02美元/分钟。如果他从西班牙到意大利选择,它应该显示0.05美元/分钟等。我希望你明白。

感谢提前:)

<div class="offer"> 
    <p>Our special offer for you is:</p> 
    <p id="big-offer">Only $0.01/min</p> 
    <button type="submit" class="btn btn-default btn-lg" id="big-cta">Strong Call to Action!</button> 
</div> 

回答

1

我建立类似前阵子一个客户的东西,这是丑陋的地狱,绝对可以有很多更干,但它的作品。我的报价生成器有三个参数:服务,卧室和家具,并返回一个值。你应该能够调整这个以适应你的需求。如果你想看到它的工作,你可以check it out here。这是一个单:

var quoteMaker = { 
     data : { 
      'services':null, 
      'bedrooms':null, 
      'furnishing':null, 
      'quoteString':'' 
     }, 
     servicesListener : function(){ 
      this.data.services = document.getElementById('service').options[document.getElementById('service').selectedIndex].text; 
     }, 
     bedroomsListener : function(){ 
      this.data.bedrooms = document.getElementById('bedrooms').options[document.getElementById('bedrooms').selectedIndex].text; 
     }, 
     furnishingListener : function(){ 
      this.data.furnishing = document.getElementById('furnishing').options[document.getElementById('furnishing').selectedIndex].text; 
     }, 
     changeData : function(divObj){ 
      this.data.quoteString=''; 
      if(divObj.id == 'service'){ 
       this.servicesListener(); 
      }else if(divObj.id == 'bedrooms'){ 
       this.bedroomsListener(); 
      }else if(divObj.id == 'furnishing'){ 
       this.furnishingListener(); 
      } 
      this.updateQuote(); 
     }, 
    updateQuote : function() { 
     if (this.data.services == "Inventory" &&this.data.bedrooms =="1" && this.data.furnishing == "Furnished") 
     this.data.quoteString = "= £70"; 
     if (this.data.services == "Inventory" &&this.data.bedrooms =="2" && this.data.furnishing == "Furnished") 
     this.data.quoteString = "= £75"; 
     if (this.data.services == "Inventory" &&this.data.bedrooms =="3" && this.data.furnishing == "Furnished") 
     this.data.quoteString = "= £80"; 
     if (this.data.services == "Inventory" &&this.data.bedrooms =="4" && this.data.furnishing == "Furnished") 
     this.data.quoteString = "= £85"; 
     if (this.data.services == "Inventory" &&this.data.bedrooms =="5" && this.data.furnishing == "Furnished") 
     this.data.quoteString = "= £90"; 
     if (this.data.services == "Inventory" &&this.data.bedrooms =="6+" && this.data.furnishing == "Furnished") 
     this.data.quoteString = "= £100"; 

     if (this.data.services == "Inventory" &&this.data.bedrooms =="1" && this.data.furnishing == "Part Furnished") 
     this.data.quoteString = "= £60"; 
     if (this.data.services == "Inventory" &&this.data.bedrooms =="2" && this.data.furnishing == "Part Furnished") 
     this.data.quoteString = "= £65"; 
     if (this.data.services == "Inventory" &&this.data.bedrooms =="3" && this.data.furnishing == "Part Furnished") 
     this.data.quoteString = "= £70"; 
     if (this.data.services == "Inventory" &&this.data.bedrooms =="4" && this.data.furnishing == "Part Furnished") 
     this.data.quoteString = "= £75"; 
     if (this.data.services == "Inventory" &&this.data.bedrooms =="5" && this.data.furnishing == "Part Furnished") 
     this.data.quoteString = "= £80"; 
     if (this.data.services == "Inventory" &&this.data.bedrooms =="6+" && this.data.furnishing == "Part Furnished") 
     this.data.quoteString = "= £85"; 

     if (this.data.services == "Inventory" &&this.data.bedrooms =="1" && this.data.furnishing == "Unfurnished (except for white goods)") 
     this.data.quoteString = "= £55"; 
     if (this.data.services == "Inventory" &&this.data.bedrooms =="2" && this.data.furnishing == "Unfurnished (except for white goods)") 
     this.data.quoteString = "= £60"; 
     if (this.data.services == "Inventory" &&this.data.bedrooms =="3" && this.data.furnishing == "Unfurnished (except for white goods)") 
     this.data.quoteString = "= £65"; 
     if (this.data.services == "Inventory" &&this.data.bedrooms =="4" && this.data.furnishing == "Unfurnished (except for white goods)") 
     this.data.quoteString = "= £70"; 
     if (this.data.services == "Inventory" &&this.data.bedrooms =="5" && this.data.furnishing == "Unfurnished (except for white goods)") 
     this.data.quoteString = "= £75"; 
     if (this.data.services == "Inventory" &&this.data.bedrooms =="6+" && this.data.furnishing == "Unfurnished (except for white goods)") 
     this.data.quoteString = "= £80"; 


     if (this.data.services == "Check-In" &&this.data.bedrooms =="1" && this.data.furnishing == "Furnished") 
     this.data.quoteString = "= £50"; 
     if (this.data.services == "Check-In" &&this.data.bedrooms =="2" && this.data.furnishing == "Furnished") 
     this.data.quoteString = "= £55"; 
     if (this.data.services == "Check-In" &&this.data.bedrooms =="3" && this.data.furnishing == "Furnished") 
     this.data.quoteString = "= £60"; 
     if (this.data.services == "Check-In" &&this.data.bedrooms =="4" && this.data.furnishing == "Furnished") 
     this.data.quoteString = "= £65"; 
     if (this.data.services == "Check-In" &&this.data.bedrooms =="5" && this.data.furnishing == "Furnished") 
     this.data.quoteString = "= £70"; 
     if (this.data.services == "Check-In" &&this.data.bedrooms =="6+" && this.data.furnishing == "Furnished") 
     this.data.quoteString = "= £75"; 

     if (this.data.services == "Check-In" &&this.data.bedrooms =="1" && this.data.furnishing == "Part Furnished") 
     this.data.quoteString = "= £40"; 
     if (this.data.services == "Check-In" &&this.data.bedrooms =="2" && this.data.furnishing == "Part Furnished") 
     this.data.quoteString = "= £45"; 
     if (this.data.services == "Check-In" &&this.data.bedrooms =="3" && this.data.furnishing == "Part Furnished") 
     this.data.quoteString = "= £50"; 
     if (this.data.services == "Check-In" &&this.data.bedrooms =="4" && this.data.furnishing == "Part Furnished") 
     this.data.quoteString = "= £55"; 
     if (this.data.services == "Check-In" &&this.data.bedrooms =="5" && this.data.furnishing == "Part Furnished") 
     this.data.quoteString = "= £60"; 
     if (this.data.services == "Check-In" &&this.data.bedrooms =="6+" && this.data.furnishing == "Part Furnished") 
     this.data.quoteString = "= £65"; 

     if (this.data.services == "Check-In" &&this.data.bedrooms =="1" && this.data.furnishing == "Unfurnished (except for white goods)") 
     this.data.quoteString = "= £35"; 
     if (this.data.services == "Check-In" &&this.data.bedrooms =="2" && this.data.furnishing == "Unfurnished (except for white goods)") 
     this.data.quoteString = "= £40"; 
     if (this.data.services == "Check-In" &&this.data.bedrooms =="3" && this.data.furnishing == "Unfurnished (except for white goods)") 
     this.data.quoteString = "= £45"; 
     if (this.data.services == "Check-In" &&this.data.bedrooms =="4" && this.data.furnishing == "Unfurnished (except for white goods)") 
     this.data.quoteString = "= £50"; 
     if (this.data.services == "Check-In" &&this.data.bedrooms =="5" && this.data.furnishing == "Unfurnished (except for white goods)") 
     this.data.quoteString = "= £55"; 
     if (this.data.services == "Check-In" &&this.data.bedrooms =="6+" && this.data.furnishing == "Unfurnished (except for white goods)") 
     this.data.quoteString = "= £60"; 


     if (this.data.services == "Check-Out" &&this.data.bedrooms =="1" && this.data.furnishing == "Furnished") 
     this.data.quoteString = "= £55"; 
     if (this.data.services == "Check-Out" &&this.data.bedrooms =="2" && this.data.furnishing == "Furnished") 
     this.data.quoteString = "= £60"; 
     if (this.data.services == "Check-Out" &&this.data.bedrooms =="3" && this.data.furnishing == "Furnished") 
     this.data.quoteString = "= £65"; 
     if (this.data.services == "Check-Out" &&this.data.bedrooms =="4" && this.data.furnishing == "Furnished") 
     this.data.quoteString = "= £70"; 
     if (this.data.services == "Check-Out" &&this.data.bedrooms =="5" && this.data.furnishing == "Furnished") 
     this.data.quoteString = "= £75"; 
     if (this.data.services == "Check-Out" &&this.data.bedrooms =="6+" && this.data.furnishing == "Furnished") 
     this.data.quoteString = "= £80"; 

     if (this.data.services == "Check-Out" &&this.data.bedrooms =="1" && this.data.furnishing == "Part Furnished") 
     this.data.quoteString = "= £45"; 
     if (this.data.services == "Check-Out" &&this.data.bedrooms =="2" && this.data.furnishing == "Part Furnished") 
     this.data.quoteString = "= £50"; 
     if (this.data.services == "Check-Out" &&this.data.bedrooms =="3" && this.data.furnishing == "Part Furnished") 
     this.data.quoteString = "= £55"; 
     if (this.data.services == "Check-Out" &&this.data.bedrooms =="4" && this.data.furnishing == "Part Furnished") 
     this.data.quoteString = "= £60"; 
     if (this.data.services == "Check-Out" &&this.data.bedrooms =="5" && this.data.furnishing == "Part Furnished") 
     this.data.quoteString = "= £65"; 
     if (this.data.services == "Check-Out" &&this.data.bedrooms =="6+" && this.data.furnishing == "Part Furnished") 
     this.data.quoteString = "= £70"; 

     if (this.data.services == "Check-Out" &&this.data.bedrooms =="1" && this.data.furnishing == "Unfurnished (except for white goods)") 
     this.data.quoteString = "= £40"; 
     if (this.data.services == "Check-Out" &&this.data.bedrooms =="2" && this.data.furnishing == "Unfurnished (except for white goods)") 
     this.data.quoteString = "= £45"; 
     if (this.data.services == "Check-Out" &&this.data.bedrooms =="3" && this.data.furnishing == "Unfurnished (except for white goods)") 
     this.data.quoteString = "= £50"; 
     if (this.data.services == "Check-Out" &&this.data.bedrooms =="4" && this.data.furnishing == "Unfurnished (except for white goods)") 
     this.data.quoteString = "= £55"; 
     if (this.data.services == "Check-Out" &&this.data.bedrooms =="5" && this.data.furnishing == "Unfurnished (except for white goods)") 
     this.data.quoteString = "= £60"; 
     if (this.data.services == "Check-Out" &&this.data.bedrooms =="6+" && this.data.furnishing == "Unfurnished (except for white goods)") 
     this.data.quoteString = "= £65"; 
    document.getElementById("quote").innerHTML=this.data.quoteString; 
    }, 
    init: function(){} 
} 
quoteMaker.init(); 
+1

谢谢你,艾伦:)。我认为这正是我需要的。我会检查出来的。 – Mike

1

好球员,这里是我是如何做的:

function getPricing() { 
 
    var e = document.getElementById("from"); 
 
    var fromCountry = e.options[e.selectedIndex].text; 
 
    var f = document.getElementById("to"); 
 
    var toCountry = f.options[f.selectedIndex].text; 
 
    var g = fromCountry + toCountry; 
 
    var price = 0; 
 
     
 
    if (g === "GermanyRomania") {price = 0.25;}; 
 
    if (g === "GermanyBulgaria") {price = 0.19;}; 
 
    if (g === "GermanyItaly") {price = 0.32;}; 
 
    if (g === "FranceRomania") {price = 0.98;}; 
 
    if (g === "FranceBulgaria") {price = 0.11;}; 
 
    if (g === "FranceItaly") {price = 0.25;}; 
 
    if (g === "SpainRomania") {price = 0.19;}; 
 
    if (g === "SpainBulgaria") {price = 0.39;}; 
 
    if (g === "SpainItaly") {price = 0.12;}; 
 

 
    
 
    if (fromCountry != "From Country" && toCountry != "To Country") { 
 
     document.getElementById("wholeoffer").innerHTML ='<p>Our special offer for you is:</p><p id="big-offer">Only $<span id="hahaha">0.09</span>/min</p><button type="submit" class="btn btn-default btn-lg" id="big-cta">Strong Call to Action!</button>'; 
 
      
 
    document.getElementById("hahaha").innerHTML = price; 
 
      
 
     
 
     
 
     
 
    } 
 
    else { 
 
    document.getElementById("wholeoffer").innerHTML ="<p>Please keep in mind that you have to choose both countries in order to work</p><button type='submit' class='btn btn-default btn-lg' id='invalid'>Get more details</button> "; 
 
    } 
 

 
    
 
    
 
}