选择功能如何自动变成“请选择”字样？

Question

我对“选择”功能有疑问。我有两个输入“选择”功能。当我选择第一个输入选项时，我选择了第二个输入选项。如果我回到第一个输入选项更改其他选项，第二个如何自动变成“请选择”字？

下面是我的编码：

     <label for="cp8" class="control-label col-lg-4">Merchant</label>

    <div class="col-lg-5">

                            <select class="form-control required" id="branch_id3" name="branch_id3">

                                <option value="" selected>Please Select</option>

                                <!--<option value="0" selected>All</option>-->

                            <?php

                            $sql_branch = 'SELECT * FROM merchant_list;';

                            $arr_branch = db_conn_select($sql_branch);

                            foreach ($arr_branch as $rs_branch) {

                                echo '<option value="' . $rs_branch['id'] . '">' . $rs_branch['shop_name'] . '</option>';

                            }

                            ?>

                            </select>

                                </div><br><br><br>

                                 <label for="cp8" class="control-label col-lg-4">Merchant Types</label>

<div class="col-lg-5">

                            <select class="form-control required" id="merchant_type" name="merchant_type">

                                <option value="" selected>Please Select</option>

                           <option value="1">Event Sponsored</option>

                                <option value="2">Normal Merchant</option>

                            </select>

                                </div><br><br><br>

下面是我的输出图片：

输出

例如：

首先我选择 Merchant 选项是“PALVO”，然后我选择 Merchant Types 是“Event Sponsored”。之后，如果我想返回商户更改其他选项，商户类型将自动转到“请选择”选项。所以，我的问题是如何自动让商家类型转向“请选择”选项？感谢您的帮助。

Answer 1

我希望这就是你要找的$('#option').change(function(){$('#type').val(0);})<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script><select id="option">&nbsp; <option>Please Select</option>&nbsp; <option>Option</option>&nbsp; <option>Option1</option>&nbsp; <option>Option2</option></select><select id="type">&nbsp; <option value="0">Please Select</option>&nbsp; <option>Type</option>&nbsp; <option>Type1</option>&nbsp; <option>Type2</option></select>

Answer 2

您可以使用 jquerychange来操作 DOM 元素。如果您不想禁用第二个，您可以从选择标签select中删除属性。diabled并从 jquery 代码中删除它$("#select2").removeAttr('disabled');&nbsp; &nbsp; $(document).ready(function(){&nbsp; &nbsp; $("#select1").on('change',function(){&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; $("#select2").val('Please Select');&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; $("#select2").removeAttr('disabled');&nbsp; &nbsp; });&nbsp; &nbsp; });&nbsp; &nbsp; <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>&nbsp; &nbsp; Select Value:<select id="select1">&nbsp; <option>Please Select</option>&nbsp; <option>value1</option>&nbsp; <option>value2</option>&nbsp; <option>value3</option></select><select id="select2" disabled>&nbsp; &nbsp; &nbsp; <option>Please Select</option>&nbsp; &nbsp; &nbsp; <option>value1</option>&nbsp; &nbsp; &nbsp; <option>value2</option>&nbsp; &nbsp; &nbsp; <option>value3</option>&nbsp; &nbsp; </select>

Answer 3

在 select DOM 上使用.val()，并给出将被选中的选项值。有了这个检查什么是在第一次选择然后使用.val()$("#events").click(function(){&nbsp; &nbsp;if($("#events option:selected").text() == "Reset First Select"){&nbsp;$("#merchants").val('Please Select');&nbsp;}});<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>Merchants:<select id="merchants">&nbsp; <option>Please Select</option>&nbsp; <option>Saab</option>&nbsp; <option>Mercedes</option>&nbsp; <option>Audi</option></select><br>Event:<select id="events">&nbsp; <option>Reset First Select</option>&nbsp; <option selected>Saab</option>&nbsp; <option>Mercedes</option>&nbsp; <option>Audi</option></select><br>