时间戳

首页 > 解决方案 > 如果用户选择选项，如何更改占位符文本

c# - 如果用户选择选项，如何更改占位符文本

问题描述

我目前在我的 asp 表单组中有 2 个选项值，其中一个代表国家，另一个代表州/省。有什么办法可以交换文本吗？

例如，当用户选择加拿大时，占位符文本将是省份，当我们选择我们时，占位符将是状态。

<form>
<div class="form-group">
     <select asp-for="Country" class="form-control" required="required">
         <option value="Canada">Canada</option>
         <option value="U.S">U.S</option>
      </select>
</div>

<div class="form-group">
    <input asp-for="State" class="form-control" placeholder="Province" />
    <span asp-validation-for="State" class="text-danger"></span>
</div>

<button type="submit"> Submit </button>
<form>

标签： c#asp.netasp.net-mvcforms

解决方案

您可以使用 jquery 或 javascript 来实现这一点，请查看我下面的代码片段。

<form>
<div class="form-group">
     <select asp-for="Country" id="Country" class="form-control" required="required">
         <option value="Canada">Canada</option>
         <option value="U.S">U.S</option>
      </select>
</div>

<div class="form-group">
    <input asp-for="State" id="State" class="form-control" placeholder="Province" />
    <span asp-validation-for="State" class="text-danger"></span>
</div>

<button type="submit"> Submit </button>
<form>

<script>
  $(document).on("change","#Country",function(){
    var value=$(this).val();
    if(value === "Canada"){
      $("#State").prop("placeholder","Province");
    }
    else if (value === "U.S" ){
      $("#State").prop("placeholder","State");
    }
  });
</script>

推荐阅读