Question

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

我点击第一个选择List“Gold”，List 3“Legierung”（999er，999er，999er ......）

我点击“ Silber ”的第一个选择列表，列表3“Legierung”变为其他词（333er，666er .....）

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

有谁知道我该怎么做？

谢谢。

<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>

Answer 1

这是使用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');        
    }
});
});

选择备用选项

1 个答案: