修改元素required属性时select下拉框option被全部删除如何解决

问题根因 #

你代码中错误地嵌套了html()方法：
$(this).prop('required', false)本身是直接修改元素属性的操作，返回值为当前jQuery对象。你将这个返回值传入html()方法，等于直接覆盖了<select>元素原本的内部<option>内容，因此所有选项会被清空。

修复代码 #

完全移除html()的包裹即可，同时你不需要额外写each遍历，jQuery的属性操作会自动作用到所有匹配的元素上，代码可以简化为：

$(document).on("click", "#billing_as_shipping", function() {
  const shippingSameAsBilling = $(this).is(":checked");
  // 复选框勾选时，收货地址字段取消必填，反之设为必填
  $("#wrap-shipping-adress .addRequired").prop('required', !shippingSameAsBilling);
});

这样既可以正常切换required属性，也不会修改元素内部的原有内容。

内容的提问来源于stack exchange，提问作者Miroslav Komárek