0

在抱歉我的英语不好之前。因此，我描述了我的问题，非常简短。

我单击“Gold”上的第一个选择列表，列表 3“Legierung”（999er、999er、999er ......）

我在“ Silber ”上单击第一个选择列表，列表3“Legierung”成为其他词（333er，666er .....）

所以第三个列表取决于第一个列表的选择。

有谁知道我该怎么做？

谢谢你。

http://jsfiddle.net/HvmyK/

<div class=" goldrechner">

        <div id="calculator">
            <form name=" goldrechner-form" class=" goldrechner-form">
            <input name="pt" value="1650" id="pt" type="hidden">
            <input name="pc" value="100" id="pc" type="hidden">
            <input name="ex" value="1.0048" id="ex" type="hidden">
            <div class=" goldrechner-header">
                <h2>Goldrechner</h2>
            </div>

            <ul>
                <li>
                <label class="desc" for="gr_em">
                    <span>W&auml;hlen Sie Ihr Edelmetall aus</span>
                                <div>
            <select id="gr_em" name="gr_em" tabindex="1">

<option selected="selected" value="gold">Gold</option>
<option value="silber">Silber</option>
<option value="platin">Platin</option>
<option value="palladium">Palladium</option>


    </select>

            </div>

            <li>

            <label class="desc" for="gc-unit" >
            <span>Gewichtseinheit</span>

            <div>
            <select id="gc-unit" name="gc-unit" tabindex="2">
<option selected="selected" value="gramm">Gramm</option>

    </select>

         </div>

            <li class="colf">
            <label class="desc" for="gr_gewicht" >
            <span>Gewicht</span>
            <div>
            <input id="gr_gewicht" name="gr_gewicht" class="small" tabindex="3" onkeyup="" type="text">

            <li class="colr">
            <label class="desc" for="gc-purity">
            <span>Legierung</span>
                            <div>
            <select id="gc-purity" name="gc-purity" tabindex="4">

<option selected="selected" value=".75">999er</option>
<option value=".917*.725">999er</option>
<option value=".725*.8">999er</option>
<option value=".725*.75">999er</option>
<option value=".725*.585">999er</option>
<option value=".725*.417">999er</option>
<option value=".65*.375">999er</option>
<option value=".65*.333">999er</option>
                    </select>
            </div>

            <li class="worthresult">
                <div class="result">
                    <span class="num">0.00 Euro</span>
                </div>
            </li>
4

1 回答 1

0

这是使用 jQuery 的解决方案：

它当前所做的只是根据第一个选择元素中选择的选项替换第三个选择元素中每个选项的文本，但您可能还希望更改每个选项的值或 ID 以便能够识别每个选项分别。

工作小提琴：http: //jsfiddle.net/HvmyK/2/

$(document).ready(function(){
//Monitor first select element for change in selected option
$('select#gr_em').on('change', function(){
    console.log('changed');
    //Change 3rd select text if gold option selection
    if($('option:selected', this).val() === 'gold'){
        $('select#gc-purity option:eq(0)').text('Gold - New Option 1');
        $('select#gc-purity option:eq(1)').text('Gold - New Option 2');
        $('select#gc-purity option:eq(2)').text('Gold - New Option 3');
        $('select#gc-purity option:eq(3)').text('Gold - New Option 4');
        $('select#gc-purity option:eq(4)').text('Gold - New Option 5');
        $('select#gc-purity option:eq(5)').text('Gold - New Option 6');
        $('select#gc-purity option:eq(6)').text('Gold - New Option 7');
    }
    //Change 3rd select text if silber option selection
    else if($('option:selected', this).val() === 'silber'){
        $('select#gc-purity option:eq(0)').text('Silber - New Option 1');
        $('select#gc-purity option:eq(1)').text('Silber - New Option 2');
        $('select#gc-purity option:eq(2)').text('Silber - New Option 3');
        $('select#gc-purity option:eq(3)').text('Silber - New Option 4');
        $('select#gc-purity option:eq(4)').text('Silber - New Option 5');
        $('select#gc-purity option:eq(5)').text('Silber - New Option 6');
        $('select#gc-purity option:eq(6)').text('Silber - New Option 7');          
    }
    //Change 3rd select text if platin option selection
    else if($('option:selected', this).val() === 'platin'){
        $('select#gc-purity option:eq(0)').text('Platin - New Option 1');
        $('select#gc-purity option:eq(1)').text('Platin - New Option 2');
        $('select#gc-purity option:eq(2)').text('Platin - New Option 3');
        $('select#gc-purity option:eq(3)').text('Platin - New Option 4');
        $('select#gc-purity option:eq(4)').text('Platin - New Option 5');
        $('select#gc-purity option:eq(5)').text('Platin - New Option 6');
        $('select#gc-purity option:eq(6)').text('Platin - New Option 7');           
    }
    //Change 3rd select text if palladium option selection 
    else if($('option:selected', this).val() === 'palladium'){
        $('select#gc-purity option:eq(0)').text('Palladium - New Option 1');
        $('select#gc-purity option:eq(1)').text('Palladium - New Option 2');
        $('select#gc-purity option:eq(2)').text('Palladium - New Option 3');
        $('select#gc-purity option:eq(3)').text('Palladium - New Option 4');
        $('select#gc-purity option:eq(4)').text('Palladium - New Option 5');
        $('select#gc-purity option:eq(5)').text('Palladium - New Option 6');
        $('select#gc-purity option:eq(6)').text('Palladium - New Option 7');        
    }
});
});
于 2013-01-31T17:15:14.270 回答