select动态添加和删除

最新推荐文章于 2023-06-26 22:22:38 发布

letian003

最新推荐文章于 2023-06-26 22:22:38 发布

阅读量438

点赞数

CC 4.0 BY-SA版权

文章标签： function 产品 object null

本文链接：https://blog.youkuaiyun.com/letian003/article/details/4171219

本文介绍了一段JavaScript脚本，该脚本用于根据用户选择的产品类型动态更新产品型号选项。支持两种产品类型：HostingOrder和MailOrder，并为后者提供三种尝试方案。

<script type="text/javascript">
$("#product_key").change(function()
{
	if($("#product_key").val() == "HostingOrder"){
		removeOptions(document.getElementById("plan_name"));
	}
	else if($("#product_key").val() == "MailOrder"){
		removeOptions(document.getElementById("plan_name"));
	document.getElementById("plan_name").options[0] = new Option("M-TryoutA",1);
	document.getElementById("plan_name").options[1] = new Option("M-TryoutB",2);
	document.getElementById("plan_name").options[2] = new Option("M-TryoutC",3);
	}
	else{
		removeOptions(document.getElementById("plan_name"));
		document.getElementById("plan_name").options[0] = new Option("请选择产品型号",0);
	}
});
function removeOptions(selectObj)
{
    if (typeof selectObj != 'object')
    {
        selectObj = document.getElementById(selectObj);
    }

    // 原有选项计数
    var len = selectObj.options.length;

    for (var i=0; i < len; i++)
    {
        // 移除当前选项
        selectObj.options[0] = null;
    }
}

$("#sub").click(function(){
if($("#product_key").val()==0||$("#product_key").val()==""||$("#plan_name").val()==0||$("#plan_name").val()==""){
	alert("产品类型及产品型号不能为空!");
	return false;
}
else{
	$("#applyForm").submit();
}
});