1

フォームがあります。ユーザーが入力し、そのフォームの下部に、フォーム ページに挿入された値ベースの値を表示しようとしています。

私はこれまでのところ、いかなる種類の出力もまったく得ていません。ここに私の試みがあります:

HTMLフォーム:

<form id="myform">
 <select   
            name="sv_313"
            onchange="calculate()"
            id="sv_313"
        >
                <option value="Select One">Select One</option>
                <option value="0.1">A</option>
                <option value="0.2">B</option>
                <option value="0.3">C</option>
        </select>
<br/>
           <input 

                type="number" 
                name="sv_312" 
                size="10" 
                maxlength="10"
                onblur="calculate()"
                id="sv_312" 
            />


Calculated value 
            <div id="coverage"> </div>

</form>

ジャバスクリプト:

<script>
//define an array for the possible values input via select menu
var spv = new Array();
spv["A"]=0.1;
spv["B"]=0.2;
spv["C"]=0.3;


//function to get the value from select menu
function getSAMprevalence()
{
var SAMprevalence=0;    
var theForm = document.forms["myform"];
var selectedSAMprevalence = theForm.elements["sv_313"];
SAMprevalence = spv[selectedSAMprevalence.value]
return SAMprevalence;
}

//function to get the value from input field
function getInputvalue()
{
var Inputvalue=0;   
var theForm = document.forms["myform"];
var Inputvalue = theForm.elements["sv_312"];
return Inputvalue;
}

//function to calculate using these two functions, and output into div named coverage:
function calculate()
{
var treatmentCoverage = getSAMprevalence() + getInputvalue();
document.getElementById('coverage').innerHTML =
                                      ""+treatmentCoverage;
}
    </script>

私はjavacsriptなどの経験がまったくありません。ポインタをいただければ幸いです。ありがとう!

EDIT:ここに設定されたjsfiddleがあり、出力がないことを示しています:( http://jsfiddle.net/rHu8J/3/

4

3 に答える 3

3

jQueryを使用してみてください。

デモ

$(function() {
    $('#sv_313').on('change', function() {
        calculate();
    });

    $('input[name=sv_312]').on('blur', function() {
        calculate();
    });
});

function calculate() {
    var $select = $('#sv_313').val();
    var $text = $('input[name=sv_312]').val();

    if ($select == undefined || $select == '' ||$select == 'Select One') {
        $select = 0;
    }
    else {
        $select = parseFloat($select);
    }
    //
    if ($text == undefined || $text == '') {
        $text = 0;
    }
    else {
        $text = parseFloat($text);
    }

    $('.coverage').html($select + $text);
}​
于 2012-10-03T01:15:08.537 に答える
2

HTML:

<form id="myform">
    <select name="sv_313" onchange="calculate()" id="sv_313">
        <option value="0">Select One</option>
        <option value="0.1">A</option>
        <option value="0.2">B</option>
        <option value="0.3">C</option>
    </select>
    <br/>
    <input type="number" id="sv_312" size="10" maxlength="10" onchange="calculate()"/>
</form>
Calculated value 
<div id="coverage"></div>

Javascript:

function calculate() {
    var myForm = document.forms['myform'];
    var selectVal = myForm.elements['sv_313'].value;
    var inputVal = myForm.elements['sv_312'].value;
    if(!inputVal) inputVal = 0;
    document.getElementById('coverage').innerHTML = parseFloat(selectVal) + parseInt(inputVal);
}
于 2012-10-03T01:35:39.420 に答える
0

選択したオプションを取得したときのエラーだと思います。代わりにこれを試してください:

SAMprevalence = spv[selectedSAMprevalence.options[selectedSAMprevalence.selectedIndex].text]

おかげで: JavaScript を使用してドロップダウン リストで選択した値を取得しますか?

于 2012-10-03T00:57:27.737 に答える