1

私たちの先生は、私たちが持っているペニー、ダイムなどの数を数え、合計金額を与えるコインの瓶を作成するように私たちに求めました.

これは彼が私たちに使ってほしいテンプレートです

https://online.pcc.edu/content/enforced/70599-22278.201302/labs/frameworks/Lab4Template.html?_&d2lSessionVal=0Zb6SMZBBcQ8ENPN4HdQk4js0

彼は、ペニー、ニッケル、ダイム、クォーターをコンマで区切って同じテキスト ボックスに入力するよう求めています。私の質問は、どうすればそれを行うことができますか? JavaScriptでそれを行う方法がわかりません。誰でも私を正しい方向に導くことができますか？

ここにコードがあります

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title> 122 Lab 4 Template </title>
    <meta name="author" content="Lee Middleton" />
    <meta name="keywords" content="CIS122" />
    <meta name="description" content="CIS 122 Lab 4" />
    <link rel="stylesheet" type="text/css" href="/content/enforced/70599-22278.201302/labs/frameworks/../../new122_Style.css?_&amp;d2lSessionVal=FeMQRN1p4YNBW7SRb8H38sRQW" />
    <style type="text/css">
        .container {
            border: 1px solid black;
            border-radius: 15px;
            width: 350px;
            margin: 25px auto;
            padding: 10px;
        }
        .result {
            width: 175px;
            float: left;
        }
        p { margin: 5px 0 0 5px;}
        .clear { clear: both; }
        input[type='button'] {
            margin: 10px 0 0 5px;
        }
    </style>
    <script language="javascript">
        function countCoins()
        {
            // Add your code here to count the coins and display your answers
        }
    </script>

<script type="text/javascript" src="/d2l/common/mathjax/2.0/MathJax.js?config=MML_HTMLorMML%2c%2fd2l%2flp%2fmath%2fdisplay%2fconfig.js%3fv%3d9.4.1000.156-10" ></script></head>

<body>
<h1>CIS 122 Lab 4</h1>
<div class="container">
<h2>SORT-O-COIN</h2>
<form name="clubForm" style="margin-bottom: 10px;">
<div style="margin-left: 10px;">Coin Jar <input name="coinJar" size="40" type="text" /></div>
<p>Number of pennies: <span name="pennies"></span></p>
<p>Number of nickels: <span name="pennies"></span></p>
<p>Number of dimes: <span name="pennies"></span></p>
<p>Number of quarters: <span name="pennies"></span></p>
<p>Number of half-dollars: <span name="pennies"></span></p>
<p>Total number of coins: <span name="totalCoins"></span></p>
<p>Total value: <span name="totalValue"></span></p>
<input value="Count the coins" onclick="countCoins()" type="button" /></form></div>
</body>
</html>
4

3 に答える 3

1

あなたのテキスト、カンマで分割String.split

var valuesArray = yourInput.split(',');

によって分割された値の配列を提供します,。それらはインデックスによってアクセスできます。

var first = valuesArray[0];
var second = valuesArray[1]; //and so on...

カウントに関しては、そこから把握できます。

于 2013-05-09T22:32:37.200 に答える
0

これを参考にしてください。

注: これは完全ではない可能性があり、まだいくつかの作業が必要な場合がありますが、そのような質問に対処するため、または検索/質問するための特定の事項を提供するために知っておく必要があるすべてを示しています。学び。

CSS

.container {
    border: 1px solid black;
    border-radius: 15px;
    width: 350px;
    margin: 25px auto;
    padding: 10px;
}
.result {
    width: 175px;
    float: left;
}
p {
    margin: 5px 0 0 5px;
}
.clear {
    clear: both;
}
input[type='button'] {
    margin: 10px 0 0 5px;
}

HTML

<h1>CIS 122 Lab 4</h1>

<div class="container">

<h2>SORT-O-COIN</h2>

    <form id="clubForm" style="margin-bottom: 10px;">
        <div style="margin-left: 10px;">Coin Jar
            <input id="coinJar" size="40" type="text">
        </div>
        <p>Number of pennies: <span id="pennies"></span>

        </p>
        <p>Number of nickels: <span id="nickels"></span>

        </p>
        <p>Number of dimes: <span id="dimes"></span>

        </p>
        <p>Number of quarters: <span id="quarters"></span>

        </p>
        <p>Number of half-dollars: <span id="halfDollars"></span>

        </p>
        <p>Total number of coins: <span id="totalCoins"></span>

        </p>
        <p>Total value: <span id="totalValue"></span>

        </p>
        <input value="Count the coins" id="countCoinsButton" type="button">
    </form>
</div>

Javascript

(function (global) {
    var types = "pennies nickels dimes quarters halfDollars".split(" "),
        worths = "0.01 0.05 0.10 0.25 0.5".split(" "),
        numTypes = types.length,
        totals = {},
        coinJar,
        clubForm;

    function countCoins() {
        var values = coinJar.value.trim().split(","),
            length = Math.min(numTypes, values.length),
            i = 0,
            coins,
            value;

        clubForm.reset();
        while (i < length) {
            value = values[i].trim();
            if (value !== "") {
                coins = parseInt(value, 10) || 0;
                totals[types[i]] = (totals[types[i]] || 0) + coins;
                totals["coins"] = (totals["coins"] || 0) + coins;
                totals["value"] = parseFloat(((totals["value"] || 0) + (coins * parseFloat(worths[i]))).toFixed(2));
            }

            i += 1;
        }

        length = types.length;
        i = 0;
        while (i < length) {
            document.getElementById(types[i]).textContent = totals[types[i]] || 0;
            i += 1;
        }

        document.getElementById("totalCoins").textContent = totals["coins"] || 0;
        document.getElementById("totalValue").textContent = totals["value"] || "0.00";
    }

    global.addEventListener("load", function onLoad() {
        global.removeEventListener("load", onLoad);
        clubForm = document.getElementById("clubForm");
        coinJar = document.getElementById("coinJar");
        document.getElementById("countCoinsButton").addEventListener("click", countCoins, false);
    }, false);
}(window))

jsfiddleについて

于 2013-05-09T23:16:24.307 に答える