javascript - jQuery : Assign null to selected dropdown value

Question

我有两个下拉菜单。当选择第一个下拉列表中的 student 特定值时，我希望将第二个下拉列表 Assign 值设置为 null。

第一个下拉列表:

<select name="Reg">
  <option value="">Choose</option>
  <option value="admin">Admin</option>
  <option value="student">Student</option>
</select>

这是第二个隐藏的下拉菜单，仅在选择值为 admin 的 Reg 时显示。

<select name="Assign"> 
  <option value="">Choose</option> 

<?php
$sql=odbc_exec($conn,'SELECT AssignCd, AssignNm FROM AssignList');
if(odbc_fetch_row($sql))
  {
    $AssignCd= odbc_result($sql, "AssignCd");
    $AssignNm= odbc_result($sql, "AssignNm");
    echo "<option value='".$AssignCd."'>".$AssignNm."</option>";
  } 
?>

</select>  

我尝试执行以下操作，但不起作用。

请帮忙。

if($("#Reg").val("student");) {
  $("#AssignCd").val(""); 
  $("#AssignNm").val("");
}

更新:

当选择Admin时，将自动选择带有admin is selected的Assign。问题是当我将选项更改为 Student 时，假定的值 student is selected 未显示。

如何使 Admin 和 Student 的 Assign 值保持不变，而不是在它们之间混淆？

这是我的代码:

fiddle

$(document).ready(function() {
  $("#Reg").on("change", function() {
    if ($(this).find("option:selected").text() === 'Admin') {
       $("#Assign").show();
	   $('select[name="Assign"] option[name="student_assign"]').attr("disabled",true).prop("selected", false).wrap('<span>');
	   $('select[name="Assign"] option[name="admin_assign"]').prop('selected',true);
		}
		else if ($(this).find("option:selected").text() === 'Student') {
	    $("#Assign").show();
		$('select[name="Assign"] option[name="student_assign"]').prop('selected',true);  
		} else {
		$("#Assign").hide().attr("disabled"," ");
		}
	});
});

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

<select name="Reg" id="Reg">
  <option value="">Choose</option>
  <option value="admin">Admin</option>
  <option value="student">Student</option>
</select>

<select name="Assign" id="Assign"> 
  <option value=" ">Choose</option> 
  <option name ="student_assign" value="student_assign">student is chosen</option>  
  <option name ="admin_assign" value="admin_assign">admin is chosen</option> 
</select>

Answer 1

• $('select[name="Reg"]').on('change', function() {})当您在select中选择一个选项时，这将触发
• $(this).find("option:selected").val() == "student"这将查看您是否选择了 option值为“学生”
• $('select[name="Assign"] option[value="AssignCd"]').text("");这设置了 option 的文本值=将Cd分配给空

如果不向我们展示您为 <select name="Assign"> 生成的 html，我们就可以走多远。

$('select[name="Reg"]').on('change', function() {
  if ($(this).find("option:selected").val() == "student") {
    $('select[name="Assign"] option[value="AssignCd"]').text("");
  }
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select name="Reg">
  <option value="">Choose</option>
  <option value="admin">Admin</option>
  <option value="student">Student</option>
</select>

<select name="Assign"> 
  <option value="AssignCd">AssignNm</option>
  
</select>

更新

无需使用.wrap()据我所知，使用 .hide() / .show()看下面的例子。

$(document).ready(function() {
  $("#Reg").on("change", function() {
    if ($(this).find("option:selected").text() === 'Admin') {
      $("#Assign").show();
      $('select[name="Assign"] option[name="student_assign"]').attr("disabled", true).prop("selected", false).hide();
      $('select[name="Assign"] option[name="admin_assign"]').prop('selected', true);
    } else if ($(this).find("option:selected").text() === 'Student') {
      $('select[name="Assign"] option[name="student_assign"]').attr("disabled", false).prop("selected", true).show()
      $('select[name="Assign"] option[name="student_assign"]').prop('selected', true);
    } else {
      $("#Assign").hide().attr("disabled", " ");
    }
  });
});

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

<select name="Reg" id="Reg">
  <option value="">Choose</option>
  <option value="admin">Admin</option>
  <option value="student">Student</option>
</select>

<select name="Assign" id="Assign"> 
  <option value=" ">Choose</option> 
  <option name ="student_assign" value="student_assign">student is chosen</option>  
  <option name ="admin_assign" value="admin_assign">admin is chosen</option> 
</select>