Javascript 自动选择另一个下拉列表的下拉选项
我有三个下拉列表,但我需要根据1中的选择自动选择2和3。为此,我使用了数据级别属性(因为我将使用其他用途的值) 例如: 在主下拉列表中我有食物,在奴隶1中我有饮料,在奴隶2中我有甜点Javascript 自动选择另一个下拉列表的下拉选项,javascript,php,jquery,wordpress,Javascript,Php,Jquery,Wordpress,我有三个下拉列表,但我需要根据1中的选择自动选择2和3。为此,我使用了数据级别属性(因为我将使用其他用途的值) 例如: 在主下拉列表中我有食物,在奴隶1中我有饮料,在奴隶2中我有甜点 饮料和甜点将根据食物选择。如果您选择食物选项一,您将自动选择饮料选项一和甜点选项一。我认为您不应该使用: element.data('level') 相反,请使用以下命令: this.data('level')在您的情况下,您可以在jQuery中获得如下所示的选择选项:$(this.find)(“:selected
饮料和甜点将根据食物选择。如果您选择食物选项一,您将自动选择饮料选项一和甜点选项一。我认为您不应该使用:
element.data('level')
相反,请使用以下命令:
this.data('level')
在您的情况下,您可以在jQuery中获得如下所示的选择选项:$(this.find)(“:selected”)
。因此,守则将是:
$(“选择[name=dimensions],选择[name=pesos],选择[name=codigos]”)。更改(函数(){
变量级别=$(this).find(“:selected”).data('level');
$(“选择[name=dimensions],选择[name=pesos],选择[name=codigos]”)。不是(这个)。每个(函数(){
$(this).find(':selected').prop('selected',false);
$(this.find(“[datalevel='”+level+']”).prop('selected',true));
});
});代码>
尺寸
选择行动
20 x 60 x 45
30 x 10 x 50
10 x 10 x 30
比索
选择行动
400
320
100
Codigos
选择行动
A123
A263
A555
如果您能添加一点解释,那会有所帮助。。。对于将来的人…好的,我编辑了原始文章,代码片段只有在值相同的情况下才能工作,在这种情况下,数据级别是相同的,对不起
<label>Dimensiones</label>
<span class="wpcf7-form-control-wrap dimensiones">
<!-- Dropdown Master or 1 -->
<select name="dimensiones" id="dimensiones" class="wpcf7-select quoteform">
<option value="" selected="selected" data-level="0">Seleccione una opción</option>
<option value="20 x 60 x 45" data-level="1">20 x 60 x 45</option>
<option value="30 x 10 x 50" data-level="2">30 x 10 x 50</option>
<option value="10 x 10 x 30" data-level="3">10 x 10 x 30</option>
</select>
</span>
<label>Peso</label><br>
<span class="wpcf7-form-control-wrap pesos">
<!-- Dropdown slave or 2 -->
<select name="pesos" id="pesos" class="wpcf7-select quoteform">
<option value="" selected="selected" data-level="0">Seleccione una opción</option>
<option value="400" data-level="1">400</option>
<option value="320" data-level="2">320</option>
<option value="100" data-level="3">100</option>
</select>
</span>
<label>Codigos</label><br>
<span class="wpcf7-form-control-wrap codigos">
<!-- Dropdown slave or 3 -->
<select name="codigos" id="codigos" class="wpcf7-select quoteform">
<option value="" selected="selected" data-level="0">Seleccione una opción</option>
<option value="A123" data-level="1">A123</option>
<option value="A263" data-level="2">A263</option>
<option value="A555" data-level="3">A555</option>
</select>
</span>
$("select[name=dimensiones], select[name=pesos], select[name=codigos]").change(function() {
var value = element.data('level');
$("select[name=dimensiones], select[name=pesos], select[name=codigos]").not(this).val(value);
});