我有一个单选按钮，可更改页面上的html内容，但在某种情况下无法使其正常工作

Question

这是有问题的应用程序：

http://codepen.io/illpill/pen/pPpWOZ

代码混乱的地方：

$(document).ready(function() {
    getsWeather('seattle, wa', 'f');
    $("#locSearchBtn").click(function() {
        getsWeather(document.getElementById('locSearch').value, 'f');
        return false;
    });
    $("#locSearchForm").submit(function() {
        getsWeather(document.getElementById('locSearch').value, 'f');
        return false;
    });
    $('input[type=radio][name=measurement]').change(function() {
        if (this.value == 'far') {
            getsWeather(document.getElementById('locSearch').value, 'f');
        } else if (this.value == 'cel') {
            getsWeather(document.getElementById('locSearch').value, 'c');
        }
    });
});

单选按钮应该将温度从C更改为F。但是，我对它进行了编码，以利用搜索栏中的值，但在初始视图下，搜索栏中没有任何值。 如何在simpleweather框架内访问城市，并使此代码更有效地工作？ 另外，还有一些要点可以帮助我使整个过程淡出并显得更平滑。 我似乎不知道该怎么做。 我将.fadeIn（）添加到许多不同的地方，但是没有任何效果。

Answer 1

要进行过渡，您可以使用：

.today{
      -webkit-transition: background-color 5000ms ease-out 1s;
      -moz-transition: background-color 5000ms ease-out 1s;
        -o-transition: background-color 5000ms ease-out 1s;
        transition: background-color 5000ms ease-out 1s;
}

要插入初始值onload，您可以在HTML中使用它：

<body onload="insertvalue()">