2016-09-02 5 views
0

実験的なセルサイズの電卓を作成しようとしています。セルの数/サイズを返すために、私は入力タグの名前フィールドでチェック項目の数を数えるJavaScript関数を作成します。JavaScript機能で使用すると、HTMLチェックボックスの入力が「true」または「false」に変更されます

この関数は正常に機能しているように見えますが、チェックボックスを各入力の値タグの内容を表示する静的な値のフィールドに変換すると予期せぬ結果が生じます(シリーズではなく個々のチェックボックスの参照) 。

私が欲しい(となっていた)この:

Correct Input Appearance

代わりに、私は現在、これを取得:以下

Current Input Appearance

コード。ありがとうございました。

function updateresults() { 
 
    var cb_counts = {}; 
 
    var inputs = document.getElementsByTagName('input'); 
 
    for (var i = 0; i < inputs.length; i++) { 
 
    var ip = inputs[i]; 
 
    if (ip.type = 'checkbox' && ip.checked) { 
 
     if (cb_counts[ip.name]) { 
 
     cb_counts[ip.name] ++; 
 
     } else { 
 
     (cb_counts[ip.name] = 1); 
 
     } 
 
    } 
 
    } 
 
    var mincells = cb_counts["reltype"] * cb_counts["relqual"] * cb_counts["ask"] * cb_counts["cause"] * cb_counts["receff"] * cb_counts["retone"] * cb_counts["doneff"]; 
 
    document.getElementById("mc").innerHTML = mincells; 
 
    var samplen = document.getElementById("samps").value; 
 
    var percell = samplen/mincells; 
 
    document.getElementById("pc").innerHTML = percell; 
 
}
<h1>Experimental Cell Size Calculator</h1> 
 
<div name="metadata"> 
 
    Author: Nathaniel D. Porter 
 
    <br>Revised: September 2, 2016 
 
    <br> 
 
    <em>Please contact the <a href="mailto://[email protected]">author</a> for permission to use or modify</em> 
 
    <br> 
 
</div> 
 
<div name="directions"> 
 
    Check the boxes for each option to include in collection of the following experimental manipulations. Checking only one box effectively removes the manipulation so that all participants receive the checked version. 
 
    <br>To calculate the cell size for a specific interaction, select the question names to interact. Checking all interactions shows the size of minimal cells. This will not change the option selections above. As you change the options, the output will automatically 
 
    update below. 
 
</div> 
 
<div name="inputDiv"> 
 
    <p> 
 
    Total Sample Size: 
 
    <input type="number" name="samplesize" id="samps" value="1000" step="1"> 
 
    </p> 
 
    <p> 
 
    Relationship to Donor: 
 
    <br> 
 
    <input type="checkbox" name="reltype" value="Parent" checked>Parent 
 
    <br> 
 
    <input type="checkbox" name="reltype" value="Sibling">Sibling 
 
    <br> 
 
    <input type="checkbox" name="reltype" value="Aunt">Aunt 
 
    <br> 
 
    <input type="checkbox" name="reltype" value="Colleague">Co-worker 
 
    <br> 
 
    </p> 
 
    <p> 
 
    Quality of Relationship: 
 
    <br> 
 
    <input type="checkbox" name="relqual" value="Random">Random 
 
    <br> 
 
    <input type="checkbox" name="relqual" value="Important" checked>Important Matters 
 
    <br> 
 
    </p> 
 
    <p> 
 
    Type of discovery: 
 
    <br> 
 
    <input type="checkbox" name="ask" value="recAsk">Asked directly by recipient 
 
    <br> 
 
    <input type="checkbox" name="ask" value="heard" checked>Overheard through someone else 
 
    <br> 
 
    </p> 
 
    <p> 
 
    Implied cause of need: 
 
    <br> 
 
    <input type="checkbox" name="cause" value="none" checked>None stated 
 
    <br> 
 
    <input type="checkbox" name="cause" value="nofault">Genetic (no fault) 
 
    <br> 
 
    <input type="checkbox" name="cause" value="fault">Lifestyle (fault) 
 
    <br> 
 
    </p> 
 
    <p> 
 
    Stated effect on recipient: 
 
    <br> 
 
    <input type="checkbox" name="receff" value="longer" checked>Live longer 
 
    <br> 
 
    <input type="checkbox" name="receff" value="better">Live better 
 
    <br> 
 
    </p> 
 
    <p> 
 
    Tone of stated effect on recipient: 
 
    <br> 
 
    <input type="checkbox" name="retone" value="neg" checked>Prevent negative (not die/less pain) 
 
    <br> 
 
    <input type="checkbox" name="retone" value="pos">Enable positive (longer life/fuller life) 
 
    <br> 
 
    </p> 
 
    <p> 
 
    Stated effect on donor: 
 
    <br> 
 
    <input type="checkbox" name="doneff" value="none" checked>None given 
 
    <br> 
 
    <input type="checkbox" name="doneff" value="pos">Benefits 
 
    <br> 
 
    <input type="checkbox" name="doneff" value="neg">Costs 
 
    <br> 
 
    <input type="checkbox" name="doneff" value="both">Both 
 
    <br> 
 
    </p> 
 
    Interaction of interest: 
 
    <br> 
 
    <input type="checkbox" name="interaction" value="reltype" checked>Relationship to Donor 
 
    <br> 
 
    <input type="checkbox" name="interaction" value="relqual" checked>Quality of Relationship 
 
    <br> 
 
    <input type="checkbox" name="interaction" value="ask" checked>Type of discovery 
 
    <br> 
 
    <input type="checkbox" name="interaction" value="cause" checked>Implied cause of need 
 
    <br> 
 
    <input type="checkbox" name="interaction" value="receff" checked>Stated effect on recipient 
 
    <br> 
 
    <input type="checkbox" name="interaction" value="retone" checked>Tone of stated effect on recipient 
 
    <br> 
 
    <input type="checkbox" name="interaction" value="doneff" checked>Stated effect on donor 
 
    <br> 
 
</div> 
 
<div name="results"> 
 
    <p> 
 
    Number of minimal cells: 
 
    <p id="mc"></p> 
 
    Minimal cell size: 
 
    <p id="pc"></p> 
 
    <br>Number of cells in interaction: Pending 
 
    <br>Interacted cell size: Pending 
 
</div>

+1

* Typo:* 'ip.type = 'チェックボックス' && ip.checked'は' ip.type === 'チェックボックス' && ip.checked'である必要があります –

+1

比較の代わりに割り当てのため、基本的に'ip.type = ip.checked'を実行して、その値を拒否し、' 'text ''を置き換えます。 –

答えて

1

それあなたのコード内だけでの典型的なタイプミスです:

if (ip.type = 'checkbox' ... 

それはしてみましょう:

if (ip.type == 'checkbox' ... 

それはあなたのコードが実際に何であったかということに気づいたする必要がありますこの設定は:

if (ip.type = ('checkbox' && ip.checked)) 

すなわち:

if (ip.type = <boolean>) 

すなわち:trueまたはfalse、それはtype属性の無効な値であるので、ブラウザは、デフォルトの入力タイプ(テキスト)としてそれを解釈します。

+0

もちろん。私はそれを捕らえておくべきだった。関数のその部分は別の答えから借りたもので、私は十分に近いものをチェックしませんでした。はっきりと完全な説明(また@squintにもありがとう) – ndporter

関連する問題