javascript - jQuery格式化负数

Question

我正在通过 freecodecamp 在本地天气网站上工作。我想知道是否有人可以帮我弄清楚如何分配 jQuery 来显示负数周围的括号。即当它是 -5 度时，我试图让它说 (-5)。

这是我目前正在使用的 jQuery...

$(document).ready(function() {
    if (navigator.geolocation) {
        navigator.geolocation.getCurrentPosition(function(position) {
            var long;
            var lat;
            lat = position.coords.latitude;
            long = position.coords.longitude;

            var api = "http://api.openweathermap.org/data/2.5/weather?lat=" + lat + "&lon=" + long + "&appid=79b001616877b59c717616181ee219ec";

            $.getJSON(api, function(info) {
                var farh;
                var cels;
                var kelvin;
                var tempMin;
                var minTemp;
                var tempMax;
                var maxTemp;
                var tempMinC;
                var minTempC;
                var tempMaxC;
                var maxTempC;
                var strF = ("\u00B0'F'");
                var tempSwitch = false;
                kelvin = info.main.temp;
                farh = Math.round((kelvin) * (9 / 5) - 459.67);
                cels = Math.round(kelvin - 273);
                tempMinC = info.main.temp_min;
                minTempC = Math.round(tempMinC - 273);
                tempMaxC = info.main.temp_max;
                maxTempC = Math.round(tempMaxC - 273);
                tempMin = info.main.temp_min;
                minTemp = Math.round((tempMin) * (9 / 5) - 459.67);
                tempMax = info.main.temp_max;
                maxTemp = Math.round((tempMax) * (9 / 5) - 459.67);
                var city = info.name;
                var weatherInfo = info.weather[0].description;
                var forecastLow = minTemp;
                var forecastHigh = maxTemp;
                var forecastLowC = minTempC;
                var forecastHighC = maxTempC;
                var currCond = info.weather[0].icon;
                $('#farh').html(farh);
                $('#city').html(city);
                $('#weatherInfo').html(weatherInfo);
                $('#forecastLow').html(forecastLow);
                $('#forecastHigh').html(forecastHigh);
                $('#currCond').html(currCond);
                $('#switch').click(function() {
                    if (tempSwitch === false) {
                        $('#farh').html(cels);
                        $('#forecastLow').html(forecastLowC)
                        $('#forecastHigh').html(forecastHighC)
                        tempSwitch = true;
                    } else {
                        $('#farh').html(farh);
                        $('#forecastLow').html(forecastLow);
                        $('#forecastHigh').html(forecastHigh);
                        tempSwitch = false;
                    }
                });
            });
        });
    }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
<h2 class="weather-header" id="city"></h2>
				<h1><span class="curr-temp" id="farh"></span><span class="curr-temp">&deg</span></h1>
				<div class="col-md-5"></div>
				<div class="col-md-2">
					<label class="switched">
					<input type="checkbox" id="switch">
					<div class="slider"></div>
				</label>
				</div>
				<div class="col-md-5"></div>
				<h3><span class="hi-lo" id="forecastLow"></span> Low - <span class="hi-lo" id="forecastHigh"></span> High</h3>
				<p class="forecast" id="weatherInfo"></p>

Answer 1

您可以创建一个这样的函数来格式化您的输出:

function formatTemperature(value){
    if(value < 0)
        return "(" + value + ")";
    else
        return value;
};

并包装您的值调用此函数，传递值。

我已经更新了您的代码段示例。

$(document).ready(function() {
    if (navigator.geolocation) {
        navigator.geolocation.getCurrentPosition(function(position) {
            var long;
            var lat;
            lat = position.coords.latitude;
            long = position.coords.longitude;

            var api = "http://api.openweathermap.org/data/2.5/weather?lat=" + lat + "&lon=" + long + "&appid=79b001616877b59c717616181ee219ec";

            $.getJSON(api, function(info) {
                var farh;
                var cels;
                var kelvin;
                var tempMin;
                var minTemp;
                var tempMax;
                var maxTemp;
                var tempMinC;
                var minTempC;
                var tempMaxC;
                var maxTempC;
                var strF = ("\u00B0'F'");
                var tempSwitch = false;
                kelvin = info.main.temp;
                farh = Math.round((kelvin) * (9 / 5) - 459.67);
                cels = Math.round(kelvin - 273);
                tempMinC = info.main.temp_min;
                minTempC = Math.round(tempMinC - 273);
                tempMaxC = info.main.temp_max;
                maxTempC = Math.round(tempMaxC - 273);
                tempMin = info.main.temp_min;
                minTemp = Math.round((tempMin) * (9 / 5) - 459.67);
                tempMax = info.main.temp_max;
                maxTemp = Math.round((tempMax) * (9 / 5) - 459.67);
                var city = info.name;
                var weatherInfo = info.weather[0].description;
                var forecastLow = minTemp;
                var forecastHigh = maxTemp;
                var forecastLowC = minTempC;
                var forecastHighC = maxTempC;
                var currCond = info.weather[0].icon;
              
                function formatTemperature(value){
                  if(value < 0)
                    return "(" + value + ")";
                  else
                    return value;
                }
              
                $('#farh').html(farh); 
                $('#city').html(city); 
                $('#weatherInfo').html(weatherInfo); 
                $('#forecastLow').html(forecastLow); 
                $('#forecastHigh').html(forecastHigh); 
                $('#currCond').html(currCond); 
                $('#switch').click(function() {
                    if (tempSwitch === false) {
                        $('#farh').html(formatTemperature(cels));
                        $('#forecastLow').html(formatTemperature(forecastLowC));
                        $('#forecastHigh').html(formatTemperature(forecastHighC));
                        tempSwitch = true;
                    } else {
                        $('#farh').html(formatTemperature(farh));
                        $('#forecastLow').html(formatTemperature(forecastLow));
                        $('#forecastHigh').html(formatTemperature(forecastHigh));
                        tempSwitch = false;
                    }
                });
            });
        });
    }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
<h2 class="weather-header" id="city"></h2>
				<h1><span class="curr-temp" id="farh"></span><span class="curr-temp">&deg</span></h1>
				<div class="col-md-5"></div>
				<div class="col-md-2">
					<label class="switched">
					<input type="checkbox" id="switch">
					<div class="slider"></div>
				</label>
				</div>
				<div class="col-md-5"></div>
				<h3><span class="hi-lo" id="forecastLow"></span> Low - <span class="hi-lo" id="forecastHigh"></span> High</h3>
				<p class="forecast" id="weatherInfo"></p>