HTML5新标签在低版本浏览器中...-jQuery：1.5.2，下拉框应用(全部...-JSON对象转化

当前位置: 编程技术>WEB前端

本页文章导读:

▪HTML5新标签在低版本浏览器中兼容性Checklist （hacks and issues） HTML5 页面化后的兼容性Checklist页面HTML5化之后：html5shiv全部版本IE都要加载article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section 重置属性为display: block;figcaption或figure标签在ie6/7下.........

▪jQuery：1.5.2，下拉框应用(全部移动，已选移动) ylbtech-jQuery:jQuery学习jQuery语法实例下拉框应用效果截图 jQuery：1.5.2,下拉框应用（全部移动，已选移动）HTML代码返回顶部<html xmlns="http://www.w3.org/1999/xhtml"><head> <title></title&.........

▪JSON对象转化 1 (function ($) { 2 $.fn.getData = function (itemTag) { 3 var obj; 4 if (itemTag) { 5 obj = []; 6 this.find(itemTag).each(function () { 7 obj.push($(this).getData()); 8 }); 9 .........

[1]HTML5新标签在低版本浏览器中兼容性Checklist （hacks and issues）

来源: 发布时间: 2013-11-06

HTML5 页面化后的兼容性Checklist

页面HTML5化之后：

html5shiv全部版本IE都要加载

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section 重置属性为display: block;

figcaption或figure标签在ie6/7下要指定高宽（无法自适应，会继承父级元素的高宽）

iframe会产生一个默认高度。
解决办法：在iframe父级元素设置font-size:0

dom reflow时，新标签(article)在低版本浏览中会出现问题，解决方法还是换成div标签

首页项目暂时只遇到这些在html5化之后出现的问题，其他请大家指正、补充。

本文链接

[2]jQuery：1.5.2，下拉框应用(全部移动，已选移动)

来源: 发布时间: 2013-11-06

ylbtech-jQuery:jQuery学习

jQuery语法实例

下拉框应用效果截图

jQuery：1.5.2,下拉框应用（全部移动，已选移动）HTML代码返回顶部

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script src="/blog_article/js/jquery-1.6.1.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(function () {
$("#add").click(function () {
//1,方式一
// var $option = $("#select1 option:selected"); //获取选中的选项
// var $remove = $option.remove(); //删除下拉列表中选中的选项
// $remove.appendTo("#select2"); //追加给对方
//2，方式二
var $option = $("#select1 option:selected"); //获取选中的选项
$option.appendTo("#select2"); //追加给对方
});
$("#add_all").click(function () {
var $option = $("#select1 option");
$option.appendTo("#select2");
});
$("#remove").click(function () {
var $option = $("#select2 option:selected");
$option.appendTo("#select1");
});
$("#remove_all").click(function () {
var $option = $("#select2 option");
$option.appendTo("#select1");
});
});
</script>
</head>
<body>
<h3>下拉框应用</h3>
<table>
<tr>

[3]JSON对象转化

来源: 发布时间: 2013-11-06

1 (function ($) {
2 $.fn.getData = function (itemTag) {
3 var obj;
4 if (itemTag) {
5 obj = [];
6 this.find(itemTag).each(function () {
7 obj.push($(this).getData());
8 });
9 return obj;
10 }
11 else {
12 obj = {};
13 this.find("input,select").each(function (i, v) {
14 if (this.name) {
15 obj[encodeURIComponent(this.name)] = encodeURIComponent($.trim($(this).val()));
16 }
17 });
18 return obj;
19 }
20 };
21 $.fn.setData = function (obj) {
22 if ($.isPlainObject(obj)) {
23 for (var p in obj) {
24 var element = $('input[name="' + decodeURIComponent(p) + '"]' + ',select[name="' + decodeURIComponent(p) + '"]');
25 if (element.length > 0 && !$.isArray(obj[p])) {
26 element.val(decodeURIComponent(obj[p]));
27 }
28 }
29 }
30 };
31 })(jQuery);
32 $.extend({
33 toJSON: function (obj) {
34 if ($.isPlainObject(obj)) {
35 var props = [];
36 for (var p in obj) {
37 var prop = obj[p];
38 var propStr = '';
39 if ($.isArray(prop)) {
40 propStr += '[';
41 var items = [];
42 $.each(prop, function (i, v) {
43 if ($.type(v) == "number" || $.type(v) == "string") {
44 items.push('"' + v + '"');
45 }
46 else {
47 items.push($.toJSON(v));
48 }
49 });
50 propStr += items.join(',') + ']';
51 }
52 else {
53 propStr += '"' + prop + '"';
54 }
55 props.push('"' + p + '":' + propStr);
56 }
57 }
58 return '{' + props.join(',') + '}';
59 }
60 });

本文链接