System.out.println(“Hello World”);

时间:2014-01-05 01:46:52

标签: javascript html css input

我的网站上有一个javascript,但我想要一些改动。在这里,您可以看到javascript正常运行

这是javascript,其余的你可以在小提琴中找到:

var state = document.ready(function () {});

2 个答案:

答案 0 :(得分:2)

是的,有可能! 修改 :(这是jsfiddle说明的内容。)

有几种解决方案。

目前,您正在使用“input”.value来设置输入元素的值。

利用普通的旧JavaScript,您可以改为:

var someDiv = document.getElementById("someDiv");

someDiv.innerHTML = capital[i]; //or whatever you want to put in there

注意:您可以使用 .textContent 而不是 .innerHTML ,但后者适用于旧版本的IE。)

利用jQuery,你可以这样:

$('#someDiv').html(capital[i]);

//or

$('#someDiv').text(capital[i]);

要将这些内容放入HTML文档中并使其正常工作,请执行以下操作:

<!DOCTYPE html>
<html lang="en">
    <head>
       <!-- all relevant tags -->
        <script>
            //all the script stuff
        </script>
    </head>
    <body>

        <!-- all the html -->

    </body>
</html>

答案 1 :(得分:1)

您应该改进数据结构,HTML标记,并避免不必要的循环。

Demo

JS:

var data = [
    {
        state: "Alabama",
        capital: "Montgomery",
        date: "December 14, 1819",
        flower: "Camellia",
        bird: "Yellowhammer"
    },
    {
        state: "Alaska",
        capital: "Juneau",
        date: "January 3, 1959",
        flower: "Forget-me-not",
        bird: "Willow Ptarmigan"
    },
    {
        state: "Arizona",
        capital: "Phoenix",
        date: "February 14, 1912",
        flower: "Suguaro Cactus Blossom",
        bird: "Cactus Wren"
    },
    {
        state: "Arkansas",
        capital: "Little Rock",
        date: "June 15, 1836",
        flower: "Apple Blossom",
        bird: "Mockingbird"
    },
    {
        state: "California",
        capital: "Sacremento",
        date: "September 9, 1850",
        flower: "Golden Poppy",
        bird: "California Valley Quail"
    },
    {        
        state: "Colorado",
        capital: "Denver",
        date: "August 1, 1876",
        flower: "Mountain Columbine",
        bird: "Lark Bunting"
    },
    {
        state: "Connecticut",
        capital: "Hartford",
        date: "January 9, 1788",
        flower: "Mountain Laurel",
        bird: "Robin"
    },
    {
        state: "Florida",
        capital: "Tallahassee",
        date: "March 3, 1845",
        flower: "Orange Blossom",
        bird: "Mockingbird"
    },
    {
        state: "Georgia",
        capital: "Atlanta",
        date: "January 2, 1788",
        flower: "Cherokee Rose",
        bird: "Brown Thrasher"
    },
    {
        state: "Hawaii",
        capital: "Honolulu",
        date: "August 21, 1959",
        flower: "Red Hibiscus",
        bird: "Nene (Hawaiian Goose)"
    },
    {
        state: "Idaho",
        capital: "Boise",
        date: "July 3, 1890",
        flower: "Syringa",
        bird: "Mountain Bluebird"
    },
    {
        state: "Illinois",
        capital: "Springfield",
        date: "December 3, 1818",
        flower: "Violet",
        bird: "Cardinal"
    }
];

function showInfo() {
    var page = document.getElementById('spelers'),
        choice = this, // or document.getElementById('spelerslijst')
        d = data[choice.selectedIndex - 1] || {capital: '',date:'',flower:'',bird:''},
        outputs = page.getElementsByTagName('output');
    outputs[0].innerHTML = d.capital; // or page.getElementsByClassName('capital')[0].innerHTML
    outputs[1].innerHTML = d.date;    // or page.getElementsByClassName('date')[0].innerHTML
    outputs[2].innerHTML = d.flower;  // or page.getElementsByClassName('flower')[0].innerHTML
    outputs[3].innerHTML = d.bird;    // or page.getElementsByClassName('bird')[0].innerHTML
}
document.getElementById('spelerslijst').onchange = showInfo;

HTML:

<form name="spelers" id="spelers">
    <p>Selecteer een speler: 
        <select id="spelerslijst" name="spelerslijst" size="1">
            <option value="">Select ----></option>
            <option value="Alabama">Alabama</option>
            <option value="Alaska">Alaska</option>
            <option value="Arizona">Arizona</option>
            <option value="Arkansas">Arkansas</option>
            <option value="California">California</option>
            <option value="Colorado">Colorado</option>
            <option value="Connecticut">Connecticut</option>
            <option value="Florida">Florida</option>
            <option value="Georgia">Georgia</option>
            <option value="Hawaii">Hawaii</option>
            <option value="Idaho">Idaho</option>
            <option value="Illinois">Illinois</option>
        </select></p>
    <p>Capital: <output class="capital" for="spelerslijst"></output></p>
    <p>Admitted On: <output class="date" for="spelerslijst"></output></p>
    <p>State Flower: <output class="flower" for="spelerslijst"></output></p>
    <p>State Bird: <output class="bird" for="spelerslijst"></output></p>
</form>