Question

我有一个名为rec的数据库，我在其中存储以下记录：

Id  Name Surname

1   John smith
2   Roger jhonson

我希望在2个下拉菜单中显示所有记录。假设我选择了Roger，那么如果Smith上的姓氏值应该更改为Jhonson。

如果我选择John，则姓氏值应返回到smith，但如果我希望我可以将John的姓氏更改为Jhonson，则不应更改 Name 的值，选择的值应保留为John Jhonson。

有人可以告诉我该怎么做吗？

非常感谢您的帮助和提前的时间。

Answer 1

HTML

<select name="cname" class="float-right ralign" id="cname">
            <option value="" disabled selected>--select name--</option>
            <option value="1">John</option>
            <option value="2">Roger</option>
          </select>

             <select name="surname" class="float-right ralign" id="surname">
            <option value="" disabled selected>--select surname--</option>
            <option value="1">smith</option>
            <option value="2">jhonson</option>
          </select>

使用jQuery Onchange事件

   <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>

<script type="text/javascript">
$( document ).ready(function(){


    $("#cname").change(function(){
        var cname = $(this).val();
        $('#surname option').eq(cname).prop('selected', true);
    });
});

$( document ).ready(function(){

	$("#cname").change(function(){
		var cname = $(this).val();
		$('#surname option').eq(cname).prop('selected', true);
	});
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<select name="cname" class="float-right ralign" id="cname">
            <option value="" disabled selected>--select name--</option>
            <option value="1">John</option>
            <option value="2">Roger</option>
          </select>

			 <select name="surname" class="float-right ralign" id="surname">
            <option value="" disabled selected>--select surname--</option>
            <option value="1">smith</option>
            <option value="2">jhonson</option>
          </select>

选择下拉菜单1时如何更改选择下拉菜单值？

1 个答案: