利用jQuery实现电商包邮城市选择代码



60 238 80



特效描述:利用jQuery实现 电商包邮城市 选择代码,利用jQuery实现电商包邮城市选择代码

代码结构

1. 引入CSS

<link rel="stylesheet" type="text/css" href="css/bootstrap.css">
<link rel="stylesheet" href="css/RegionalChoice.css" />

2. 引入JS

<script src="js/jquery.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/RegionalChoice.js"></script>

3. HTML代码

<div class="form-group">
	<label class="col-sm-2 control-label text-right">不参与单品包邮地区</label>
	<div class="col-sm-9 col-xs-12">
		<div id="areas" class="form-control-static"></div>
		<a href="javascript:;" class="btn btn-default" data-toggle="modal" data-target="#myModal">添加不参加满包邮的地区</a>
		<input type="hidden" id="selectedareas" name="edareas" value="">
		<span class="help-block">如果设置0或空,则不支持满件包邮</span>
	</div>
</div>
<!-- 模态框(Modal) -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
	<div class="modal-dialog modal-lg">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×
				</button>
				<h4 class="modal-title" id="myModalLabel">
					选择区域
				</h4>
			</div>
			<div class="modal-body">
				<div class="test-div">
				</div>
			</div>
			<div class="modal-footer">
				<button type="button" class="btn btn-default" data-dismiss="modal">关闭
				</button>
				<button type="button" class="btn btn-primary btntest1">
					确定
				</button>
			</div>
		</div>
	</div>
</div>
<script>
$(function () {
	//------生成地区
	GetRegionPlug();
	//------选择后确定按钮
	$(".btntest1").click(function () {
		var areas = GetChecked().join(",");//已选择的城市名
		$("#areas").html(areas);//显示在页面
		$("#selectedareas").val(areas);//存入隐藏的input
		$('#myModal').modal('hide');//完后隐藏模态框
	})
})
</script>



用户评论
大牛,别默默的看了,快登录帮我点评一下吧!:)      登录 | 注册


热门标签: 右键菜单 图片头像上传 文字提示框 文件上传 提示框/弹出层 文本框 layer 下拉框 lightbox 复选 单选 Tooltip工具提示框 登录框 浮动提示框 注册框 html5弹窗动画 搜索框 验证码 二级联动 三级联动 城市选择 value赋值 筛选 按钮控制 购物车 颜色选择 表单提交 全选/反选 添加删除 添加标签 密码强度验证 表单验证 html5按钮动画 按钮样式 密码修改设置 弹出层拖动 窗口提示框 切换按钮 form表单

×
×

注册

官方QQ群

扫描上面二维码加微信群

官方QQ群

jQuery/js讨论群
群号:642649996
Css3+Html5讨论群
群号:322131262

加群请备注:从官网了解到