私がやろうとしているのは、ラジオ ボタンのグループから値を取得し、少し計算した後に値をテキスト フィールドに出力することです。以下のコードを試しましたが、何も機能していないようです。申し訳ありませんが、私は jQuery/JavaScript に関する知識があまりなく、助けを求めているわけではありません。
HTML:
<label for="ctype">
<b>Construction Type</b>
<table>
<tr><td>Timber:</td><td><input type="radio" name="ctype" value="Timber"></td></tr>
<tr><td>Brick:</td><td><input type="radio" name="ctype" value="Brick"></td></tr>
<tr><td>Concrete:</td><td><input type="radio" name="ctype" value="Concrete"></td></tr>
</table>
</label>
<!-- Roof Type -->
<label for="rtype">
<b>Roof Type</b>
<table>
<tr><td>Metal:</td><td><input type="radio" name="rtype" value="Metal"></td></tr>
<tr><td>Tile:</td><td><input type="radio" name="rtype" value="Tile"></td></tr>
<tr><td>Concrete:</td><td><input type="radio" name="rtype" value="Concrete"></td></tr>
</table>
</label>
<!-- Roof Insulation -->
<label for="rins">
<b>Insulation In Roof</b>
<table>
<tr><td>Yes:</td><td><input type="radio" name="rins" value="Yes"></td></tr>
<tr><td>No:</td><td><input type="radio" name="rins" value="No"></td></tr>
</table>
</label>
<table>
<tr><td><label for="cvars">Variables:</label></td><td><input type="text" name="cvars" class="cvars" value="0"> Squere Meters</td></tr>
<table>
JavaScript
/* Form Processing */
jQuery(document).ready(function() {
// Process Construction Type
jQuery('input:radio[name=ctype]').change(function() {
var ctype = $('input:radio[name=ctype]:checked').val();
if ( ctype == 'Timber' ) {
jQuery('.cvars').val( $('.cvars').val() + 2 );
} else if ( ctype == 'Brick' ) {
jQuery('.cvars').val( $('.cvars').val() + 1 );
} else if ( ctype == 'Concrete' ) {
jQuery('.cvars').val( $('.cvars').val() + 1 );
}
});
// Process Roof Type
jQuery('input:radio[name=rtype]').change(function() {
var ctype = $('input:radio[name=rtype]:checked').val();
if ( ctype == 'Metal' ) {
jQuery('.cvars').val( $('.cvars').val() + 4 );
} else if ( ctype == 'Tile' ) {
jQuery('.cvars').val( $('.cvars').val() + 0 );
} else if ( ctype == 'Concrete' ) {
jQuery('.cvars').val( $('.cvars').val() + 0 );
}
});
});
基本的に、誰かが構築タイプを選択すると、タイプに基づく値が cvars というテキスト フィールドで自動的に調整 (追加またはサブストレート) されます。同様に、屋根のタイプを選択すると、そのタイプに基づく値 (現在の値に追加) が vars テキスト フィールドなどに調整されます。
誰かがこれについて私を助けてください。