1

だから、Javascriptを試したのはこれが初めてです。私は基本的に、ドロップダウン ボックスで選択した値に基づいて一意の DIV を作成しようとしています。DIV を表示するようにしましたが、選択内容に基づいて値が変化しません。ここに私がこれまでに持っているものがあります：

jsfiddle

ご覧のとおり、$200,000 の範囲が選択されている場合、既に計算済みの固定値を生成したいと考えています。ドロップダウンで選択された実際のオプションに基づいて DIV を変更するために何らかの方法で生成できる switch または case select ステートメントがあるかどうかを知りたいと思っていました。正しい方向へのポインタは大歓迎です。

4

2 に答える 2

1

jQuery を使用したくない場合は、select を切り替えて、value1、value2、value3 の innerHTML を設定してみてください。

    switch(document.getElementById('mySelect').value)
{
    case '0': 
        document.getElementById('value1').innerHTML ='Principal and Interest only: $898';
        document.getElementById('value2').innerHTML = 'Estimated total monthly payment: $1,098';
        document.getElementById('value3').innerHTML ='VA loan payment:';    
        break;   
    case '1': 
        document.getElementById('value1').innerHTML ='Principal and Interest only: $998';
        document.getElementById('value2').innerHTML = 'Estimated total monthly payment: $2,098';
        document.getElementById('value3').innerHTML ='VA loan payment: $25';    
        break;          
    etc...
}
于 2012-10-03T20:54:08.017 に答える
0

jQuery を使用してこれを行う方法は次のとおりです。

<select id="mySelect" onchange="showhide(this)">
    <option value="">Desired Home Price:</option>
    <!-- the option values are suffixes for the elements to show -->
    <option value="0">$200,000</option>
    <option value="1">$175,000</option>
    <option value="2">$150,000</option>
    <option value="3">$125,000</option>
    <option value="4">$100,000</option>
    <option value="5">$75,000</option>
    <option value="6">$50,000</option>
</select>

<div class="answer0 answers" style="width:200px;height:200px;display:none">
<div id="value1">Principal and Interest only: $898</div> 
<div id="value2">Estimated total monthly payment: $1,098</div>
<div id="value3">VA loan payment:</div>
<div id="value4">Another field:</div>
</div>

<div class="answer1 answers" style="width:200px;height:200px;display:none">
<div id="value1a">Principal and Interest only: $898.00</div> 
<div id="value2a">Estimated total monthly payment: $1,098.00</div>
<div id="value3a">VA loan payment:</div>
<div id="value4a">Another field:</div>
</div>



<script type="text/javascript">

function showhide(id) {
    var mySel = $(id).val()
    $('.answers').hide()  
    $('.answer'+mySel).show()  
}

</script>

</p>

于 2012-10-03T20:39:01.937 に答える