0

私は HTML を初めて使用します。HTML ページのフォームにチェックボックスのリストがあります。

各行の各チェックボックスは、異なるカテゴリ「I」「D」「C」および「S」を表します。

私のコードの一部は次のとおりです。

<form>
    1.<input type="checkbox" name="Personality_1.1" value="I"/>Animated &nbsp;&nbsp;&nbsp;&nbsp
    <input type="checkbox" name="Personality_1.2" value="D" />Adventurous &nbsp;&nbsp;&nbsp;&nbsp
    <input type="checkbox" name="Personality_1.3" value="C" />Analytical &nbsp;&nbsp;&nbsp;&nbsp
    <input type="checkbox" name="Personality_1.4" value="S" />Adaptable<br /><br />

    2.<input type="checkbox" name="Personality_2.1" value="I"/>Playful&nbsp;&nbsp;&nbsp;&nbsp
    <input type="checkbox" name="Personality_2.2" value="D" />Persuasive&nbsp;&nbsp;&nbsp;&nbsp
    <input type="checkbox" name="Personality_2.3" value="C" />Persistent&nbsp;&nbsp;&nbsp;&nbsp
    <input type="checkbox" name="Personality_2.4" value="S" />Peaceful<br /><br />

    3.<input type="checkbox" name="Personality_3.1" value="I"/>Sociable&nbsp;&nbsp;&nbsp;&nbsp
    <input type="checkbox" name="Personality_3.2" value="D" />Strong Willed&nbsp;&nbsp;&nbsp;&nbsp
    <input type="checkbox" name="Personality_3.3" value="C" />Self-sacraficing&nbsp;&nbsp;&nbsp;&nbsp
    <input type="checkbox" name="Personality_3.4" value="S" />Submissive<br /><br />

値「I」のチェックボックスがいくつチェックされているか、値「D」のチェックボックスがいくつチェックされているかなどを調べ、フォームが送信されたときに各カテゴリの合計を表示する必要があります。

例：「5 つの D がチェックされました」「3 つの C がチェックされました」

JavascriptまたはPHPでこれを行う方法はありますか? もしそうなら、誰かが私にそうする方法を理解するのを助けることができますか?

4

6 に答える 6

2

さて、PHP では、POST でフォームを送信すると仮定します。

$counts = array_count_values($_POST);

そして、値をキー、カウントを値とする連想配列を取得します。したがって、たとえば 3Dがチェックされている場合、$counts['D']「3」が保持されます。

于 2013-07-15T20:09:17.390 に答える
1

例として、次のようなものを使用できます。

window.onload = function () {
    document.getElementById("btn1").onclick = function () {
        var allChk = document.getElementsByTagName("input"),
            counts = {},
            i, j, cur, val;
        for (i = 0, j = allChk.length; i < j; i++) {
            cur = allChk[i];
            if (cur.type === "checkbox") {
                if (!(cur.value in counts)) {
                    counts[cur.value] = 0;
                }
                if (cur.checked) {
                    counts[cur.value]++;
                }
            }
        }

        for (val in counts) {
            console.log("There are " + counts[val] + " " + val + "'s checked");
        }
    };
};

デモ: http://jsfiddle.net/Dwjez/1/

いくつかのチェックボックスをオンにしてからボタンをクリックしconsole、結果を確認します。すべてのチェックボックスを見つけて、値ごとにチェックされたチェックボックスの数をオブジェクトリテラルに保存します...その後、コンソールに結果を出力するためだけに最後のループがあります。

これはイベント処理の簡単な例にすぎませんが、addEventListener と onclickを比較して、イベントを処理する別の方法 ( を使用addEventListener) を確認することをお勧めします。

于 2013-07-15T20:14:56.223 に答える
0

どうですか...

var getCount = function(type) {
  return document.querySelectorAll('input[value='+type+']:checked').length;
}
alert(getCount('A') + "As have been selected");

チェックボックスの代わりにラジオグループを使用した方がよいようです。HTML を見て、ユーザーが各セクションで複数の項目を選択できるようにしたいですか?

于 2013-07-15T20:11:55.943 に答える
0

これがあなたが望むコードです。それを試して、私に知らせてください。 

<HTML>
<HEAD>
<TITLE>Document Title</TITLE>
</HEAD>
<BODY>

<FORM NAME="f1" action="next_page.php" method="post">
<input type="checkbox" name="chkGuar[]" value="mike">&nbsp;Mike<br />
<input type="checkbox" name="chkGuar[]" value="joy">&nbsp;Joy<br />
<input type="checkbox" name="chkGuar[]" value="harry">&nbsp;harry<br />
<input type="checkbox" name="chkGuar[]" value="watson">&nbsp;watson<br />
<input type="checkbox" name="chkGuar[]" value="george">&nbsp;george<br />
<input type="checkbox" name="chkGuar[]" value="peter">&nbsp;Peter<br />
<input type="submit" name="chksbmt" value="Send" />
<!-- <div id="myrow" style="visibility:hidden">
<input type = text name ='txtGRTNo' tabindex = 19 size="20">
</div>
<div width="338" align="left" colspan="3" height="12"></div> !-->
</FORM>

</BODY>
</HTML>

next_page.php

<?php
if(isset($_POST['chksbmt'])){
    $counts = count($_POST['chkGuar']);
    echo "this is the next page. you checked $counts checkbox <br /><br />";
    for($i=1;$i<=$counts;$i++){
    echo "<input type='text' style='border:1px solid #000;' value='your text box here' /><br/><br/>";
    }
}
于 2013-11-15T10:51:27.843 に答える
-1

フォーム コードを次のように記述する必要があります。

<form>
    1.<input type="checkbox" name="chkI[]" value="I1"/>Animated 
    <input type="checkbox" name="chkD[]" value="D1" />Adventurous 
    <input type="checkbox" name="chkC[]" value="C1" />Analytical 
    <input type="checkbox" name="chkS[]" value="S1" />Adaptable

    2.<input type="checkbox" name="chkI[]" value="I2"/>Playful
    <input type="checkbox" name="chkD[]" value="D2" />Persuasive
    <input type="checkbox" name="chkC[]" value="C2" />Persistent
    <input type="checkbox" name="chkS[]" value="S2" />Peaceful

    3.<input type="checkbox" name="chkI[]" value="I3"/>Sociable
    <input type="checkbox" name="chkD[]" value="D3" />Strong Willed
    <input type="checkbox" name="chkC[]" value="C3" />Self-sacraficing
    <input type="checkbox" name="chkS[]" value="S3" />Submissive
</form>

「name」属性 と「value」属性を見てください。私は彼らの価値観に私を変えさせました。

あなたは言う：

値「I」のチェックボックスがいくつチェックされているか、値「D」のチェックボックスがいくつチェックされているかなどを調べ、フォームが送信されたときに各カテゴリの合計を表示する必要があります。

提出すれば…

<?php

if(!empty($_GET['chkD'])) {
    $counterChkD = 0;
    foreach ($_GET['chkD'] as $chkD){
        echo $chkD."\n";
        //echoes the value set in the HTML form for each checked checkbox associated with the "D" value
        //so, if I were to check "Adventurous", "Persuasive", and "Strong Willed" it would echo value D1, value D2, value D3.
        $counterChkD++;
    }
    echo "# of 'D-CheckBoxes' checked: ".$counterChkD."\n";
}

?>
于 2013-07-15T20:11:33.813 に答える