<!DOCTYPE html>
<html>
<head>
<title>Bootstrap 实例 - 向列表组添加链接</title>
<link href="http://libs.baidu.com/bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet">
<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
<script src="http://libs.baidu.com/bootstrap/3.0.3/js/bootstrap.min.js"></script>
</head>
<body>
<div id="xxx">
<a href="#" class="list-group-item active" data-p="5">免费域名注册</a>
<a href="#" class="list-group-item active" data-p="2"
>24*7 支持</a>
<a href="#" class="list-group-item" data-p="3"
>免费 Window 空间托管</a>
<a href="#" class="list-group-item" data-p="4"
>图像的数量</a>
<a href="#" class="list-group-item active" data-p="5"
>每年更新成本</a>
</div>
<script>
$("#xxx").empty();
$("#xxx").append("<a href='#' class='list-group-item active' data-p='9'>每CCC</a>");
$("#xxx").append("<a href='#' class='list-group-item active' data-p='9'>每CCC</a>");
$("#xxx").append("<a href='#' class='list-group-item active' data-p='9'>每CCC</a>");
$("#xxx a").on("click", function() {
// $("a").removeClass("active");
$(this).addClass("active");
// alert($(this).text())
alert($(this).attr('data-p'));
});
</script>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<title>Bootstrap 实例 - 基本的列表组</title>
<link href="http://libs.baidu.com/bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet">
<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
<script src="http://libs.baidu.com/bootstrap/3.0.3/js/bootstrap.min.js"></script>
</head>
<body>
<ul class="list-group" id="xxx">
<li class="list-group-item" name="1">免费域名注册</li>
<li class="list-group-item" name="2">免费 Window 空间托管</li>
<li class="list-group-item" name="3">图像的数量</li>
<li class="list-group-item" name="4">24*7 支持</li>
<li class="list-group-item" name="5">每年更新成本</li>
</ul>
<script>
<span style="white-space:pre"> </span> var jsons = { name: "1111", age: 18 };
for (var key in jsons)
{
alert(key);
alert(jsons[key]);
}
$("#xxx li").each(function() {
alert($(this).attr('name'));
});
// $("#xxx").empty();
$("#xxx").append("<a href='#' class='list-group-item active' data-p='9'>每CCC</a>");
$("#xxx").append("<a href='#' class='list-group-item active' data-p='9'>每CCC</a>");
$("#xxx").append("<a href='#' class='list-group-item active' data-p='9'>每CCC</a>");
var tt="xxx";
$("#"+tt+" a").on("click", function() {
// $("a").removeClass("active");
$(this).addClass("active");
//alert($(this).text())
alert($(this).attr('data-p'));
});
</script>
</body>
</html>