如何跨函数/变量访问javascript值？

Question

So, three small parts:

1) a MaxMind geo IP lookup that gets us the country code via the IP address:

var onSuccess = function(x){

var ip = x.traits.ip_address;
document.getElementById('ip_address').value = ip;

var country_code = x.country.iso_code;
document.getElementById('ip_country_code').value = country_code;

…

};

2) an array of country references with tax percent decimals:

// Array of values for tax rates
var tax_rates= new Array();
tax_rates["noteu"]=0.0;
tax_rates["ES"]=21.0;
tax_rates["AU"]=20.5;
tax_rates["BE"]=21.7;
…

3) a TaxPrice function that takes one of those decimals to calculating tax and then total payable in a subscription form. Notice the XXXXX:

function TaxPrice()
{
var taxprice=0;
XXXXX
return taxprice;
}

The document.getElementById bit in 1) can obviously update a hidden field or some other HTML element.

I know what to do with XXXXX if it's a manual drop down the user has to select.

But how do I get the tax decimal out of the array and into the TaxPrice function based on the IP address country code? (ie within the javascript, not updating an HTML element).

Happy New Year to all.

UPDATE: Just to be clear, I don't need to know how to get it into a drop down, I can do that already and in this use case, the user should not be allowed to choose his own tax country, it should be set automatically based on the IP address. So the non-code wording would go something like:

taxprice EQUALS tax_rate.value ACCORDING TO ip_address_code

Answer 1

Are you looking for something like element properties? Mydiv.tax=taxvalue; Properties of Elements are an elegant way of communicating between different functions. You can assign any value to any element. You can retrieve the value from any function in JavaScript as long as the Basic element lives.

Answer 2

One way you can do it is to set a global selectedCountryCode variable inside your success callback, and reference tax_rates[selectedCountryCode] in your TaxPrice array (which should be an object, as nnnnnn pointed out)

 (function () { var selectedCountryCode = ""; var onSuccess = function(x) { var ip = x.traits.ip_address; document.getElementById('ip_address').value = ip; selectedCountryCode = x.country.iso_code; // <-- Set selectedCountryCode for later use document.getElementById('ip_country_code').value = selectedCountryCode; // <-- Set dropdown value }; document.getElementById("ip_country_code").addEventListener("change", function() { selectedCountryCode = this.value; console.log(TaxPrice()); }); // Object of values for tax rates var tax_rates = {}; tax_rates["noteu"] = 0.0; tax_rates["ES"] = 21.0; tax_rates["AU"] = 20.5; tax_rates["BE"] = 21.7; function TaxPrice() { var taxprice = 0; taxprice = tax_rates[selectedCountryCode]; return taxprice; } })(); 

 Change Me: <select id="ip_country_code"> <option value="noteu">noteu</option> <option value="ES">ES</option> <option value="AU">AU</option> <option value="BE">BE</option> </select> 

Answer 3

So, thanks for your suggestions. Not sure if I understand how this is working exactly, but after some poking around, it now is. Compared to the code in the original question, I had to:

1) Add a global variable at the top, above everything else, unrelated to the IP lookup code (ie there is now no reference to country_tax within the IP onSuccess variable):

var country_tax;

2) Replace XXXXX in the TaxPrice function with:

var country_tax = document.getElementById("ip_country_code").value;
var taxprice = taxes_from_database[country_tax];

So the full TaxPrice function ends up as:

function TaxPrice() 
{
var taxprice = 0;
var country_tax = document.getElementById("ip_country_code").value;
var taxprice = tax_rates[country_tax];
return taxprice;
}

No need, it seems, for nested functions or closures or anything very complicated. It doesn't matter (to the code) if the tax_rates are set up as an array or an object, the outcome is the same, although I would like to understand why you recommend an object over an array in this case.

And—given TaxPrice gets the value from the form field and not from within the IP onSuccess function—I don't know why I need the global variable declaration at the top, if anyone wants to have a go at explaining that…