51选项卡js

	$(".TAB_CLICK li").click(function() {
		var tab = $(this).parent(".TAB_CLICK");
		var con = tab.attr("id");
		var on = tab.find("li").index(this);
		$(this).addClass('on').siblings(tab.find("li")).removeClass('on');
		$(con).eq(on).show().siblings(con).hide();
	});


50响应式导航二级下拉菜单


	// 手机导航
	$('.menuBtn').append('<b></b><b></b><b></b>');
	$('.menuBtn').click(function(event) {
		$(this).toggleClass('open');
		var _winw = $(window).width();
		if ($(this).hasClass('open')) {
			if (_winw <= 1199) {
				$('.hdr').stop().slideDown();
			}
		} else {
			if (_winw <= 1199) {
				$('.hdr').stop().slideUp();
			}
		}
	});

	// 响应式二级导航
	function myNav() {
		var _winw = $(window).width();
		if (_winw > 1199) {
			$('.nav li').bind('mouseenter', function() {
				$(this).find('dl').stop().slideDown();
				if ($(this).find('dl').length) {
					$(this).addClass('ok');
				}
			});
			$('.nav li').bind('mouseleave', function() {
				$(this).removeClass('ok');
				$(this).find('dl').stop().slideUp();
			});
		} else {
			$('.nav li').unbind('mouseenter mouseleave');
			$('.nav .v1 i').click(function() {
				if ($(this).parent('.v1').siblings('dl').length) {
					$(this).parent('.v1').toggleClass('ok').siblings('dl').stop().slideToggle();
					$(this).parents('li').siblings('li').find('dl').stop().slideUp().siblings('.v1')
						.removeClass('ok');
					return false;
				}
			});
		}
	}
	myNav();


49响应式remjs

var zoom = window.devicePixelRatio || window.screen.deviceXDPI / window.screen.logicalXDPI;
console.log(zoom);
fontSize();
$(window).resize(function() {
	fontSize();
});

function fontSize() {
	var size;
	var winW = window.innerWidth;
	if (winW <= 1800 && winW > 800) {
		size = Math.round(winW / 18);
	} else if (winW <= 800) {
		size = Math.round(winW / 7.5);
		if (size > 65) {
			size = 65;
		}
	} else {
		size = 100;
	}
	if (zoom == 1.25) {
		$('html').css({
			'font-size': size / 1.2 + 'px'
		})
	} else if (zoom == 1.5) {
		$('html').css({
			'font-size': size / 1.4 + 'px'
		})
	} else {
		$('html').css({
			'font-size': size + 'px'
		})
	}
	if (zoom == 1.25) {
		$('html').addClass('zoom125')
	} else if (zoom == 1.5) {
		$('html').addClass('zoom150')
	}

}


48响应式rem自动计算js

var zoom = window.devicePixelRatio || window.screen.deviceXDPI / window.screen.logicalXDPI;
console.log(zoom);
fontSize();
$(window).resize(function () {
    fontSize();
});
function fontSize() {
    var size;
    var winW = window.innerWidth;
    if (winW <= 1800 && winW > 800) {
        size = Math.round(winW / 18);
    } else if (winW <= 800) {
        size = Math.round(winW / 7.5);
        if (size > 65) {
            size = 65;
        }
    } else {
        size = 100;
    }
    if (zoom == 1.25) {
        $('html').css({'font-size': size/1.2 + 'px'})
    }
    else if(zoom == 1.5){
        $('html').css({'font-size': size/1.4 + 'px'})
    }
    else{
        $('html').css({'font-size': size + 'px'})  
    }
     if (zoom == 1.25) {
      $('html').addClass('zoom125')  
     }else if(zoom == 1.5){
      $('html').addClass('zoom150')      
     }
   
}


47延时菜单定时器菜单

// .open 是出发按钮
// .box 是弹出的菜单

// 鼠标经过的按钮
$(".open").hover(function() {
    $(".box").stop(true, true).slideDown(300);
    $(this).addClass('on')
},function(){
    t = setTimeout(function(){
        $(".box").stop(true, true).slideUp(300);
        $(this).removeClass('on')
    },500)
});

// 鼠标经过菜单
$('.box').hover(function(){
    clearTimeout(t);
},function(){
    $(".box").stop(true, true).slideUp(300);
    $(".open").removeClass('on');
})


46上图下文列表

基本HTML

第一种情况

         <ul class="ul-list">
		  <li>
			  <a href="" class="con">
				  <div class="pic"><img src="" alt=""></div>
				  <div class="txt">
					  <h3 class="tit">这里是标题</h3>
					  <div class="desc">这里是简介文本</div>
					  <!-- 以下为自定义 -->
					  <div class="info">
						  <span class="view">837</span>
						  <span class="date">2020-09-09</span>
					  </div>
				  </div>
			  </a>
		  </li>
	  </ul>


li里面的.con是a标签

此代码用于只有1个连接的时候


第二种情况

          <ul class="ul-list">
  		  <li>
  			  <div class="con">
  				  <div class="pic">
					 <a href=""><img src="" alt=""></a>
				  </div>
  				  <div class="txt">
  					  <h3 class="tit"><a href="">这里是标题</a></h3>
  					  <div class="desc">这里是简介文本</div>
  					  <!-- 以下为自定义 -->
  					  <div class="info">
  						  <span class="date">2020-09-09</span>
  						  <a href="" class="more">查看更多</span>
  					  </div>
  				  </div>
  			  </div>
  		  </li>
  	  </ul>


li 里的 .con 是 div 标签

此代码用于li里面多个a连接的时候

需要给图片、标题都要单独加上a连接


45上图下文列表


基本HTML

第一种情况

         <ul class="ul-list">
		  <li>
			  <a href="" class="con">
				  <div class="pic"><img src="" alt=""></div>
				  <div class="txt">
					  <h3 class="tit">这里是标题</h3>
					  <div class="desc">这里是简介文本</div>
					  <!-- 以下为自定义 -->
					  <div class="info">
						  <span class="view">837</span>
						  <span class="date">2020-09-09</span>
					  </div>
				  </div>
			  </a>
		  </li>
	  </ul>


li里面的.con是a标签

此代码用于只有1个连接的时候


第二种情况

          <ul class="ul-list">
  		  <li>
  			  <div class="con">
  				  <div class="pic">
					 <a href=""><img src="" alt=""></a>
				  </div>
  				  <div class="txt">
  					  <h3 class="tit"><a href="">这里是标题</a></h3>
  					  <div class="desc">这里是简介文本</div>
  					  <!-- 以下为自定义 -->
  					  <div class="info">
  						  <span class="date">2020-09-09</span>
  						  <a href="" class="more">查看更多</span>
  					  </div>
  				  </div>
  			  </div>
  		  </li>
  	  </ul>


li 里的 .con 是 div 标签

此代码用于li里面多个a连接的时候

需要给图片、标题都要单独加上a连接

44flex垂直居中

.tip{
    display: flex;
    align-items: center;
    justify-content: center;
}


43css限制文本行数

限制单行文本

.tit{
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
}


限制多行文本


.tit{
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    text-overflow: ellipsis;
}


42在光标处插入字符

let textInput   = document.getElementById('body');
let insert      = textInput.selectionStart;
textInput.value = textInput.value.substr(0, insert) + str + textInput.value.substr(insert);


body 是文本框的id名字

str 是需要添加的字符


可以改成标签的事件

<ul class="js-addStr">
	<li><a href="javascript:">and</a></li>
	<li><a href="javascript:">or</a></li>
	<li><a href="javascript:">not</a></li>
	<li><a href="javascript:">{</a></li>
</ul>

<script>

$(function(){
	$('.js-addStr li').click(function(){
		str = $(this).text().trim();
		if(str){
			let textInput   = document.getElementById('body');
			let insert      = textInput.selectionStart;
			textInput.value = textInput.value.substr(0, insert) + str + textInput.value.substr(insert); 
		}
	})
})
</script>


41获取当前栏目的顶级id

可以放在style.html 模板里面

{foreach $classtypedata as $v}
{if($v['pid']==0 && isset($type) && in_array($type['id'],$v['children']['ids']) )}
{php $topid = $v['id']; /}
{/if}
{/foreach}


其他页面引用

{$topid}


获取当前顶级栏目的banner图

<div id="banIn" style="background-image: url({$classtypedata[$pid]['litpic']})"> </div>


40js 繁体切换

china.js

// 网页简繁体转换
// -------------- 以下参数大部分可以更改 --------------------
//s = simplified 简体中文 t = traditional 繁体中文 n = normal 正常显示
var zh_default = 'n'; //默认语言,请不要改变
var zh_choose = 't'; //当前选择
var zh_expires = 7; //cookie过期天数
var zh_class = 'zh_click'; //链接的class名,id为class + s/t/n 之一
var zh_style_active = 'color:red;'; //当前选择的链接式样
var zh_style_inactive = ''; //非当前选择的链接式样
var zh_browserLang = ''; //浏览器语言
var zh_autoLang_t = true; //浏览器语言为繁体时自动进行操作
var zh_autoLang_s = false; //浏览器语言为简体时自动进行操作
var zh_autoLang_alert = false; //自动操作后是否显示提示消息

var zh_autoLang_checked = 0; //次检测浏览器次数,第一次写cookie为1,提示后为2,今后将不再提示


//判断浏览器语言的正则,ie为小写,ff为大写
var zh_langReg_t = /^zh-tw|zh-hk$/i;
var zh_langReg_s = /^zh-cn$/i;

//简体繁体对照字表,可以自行替换
var zh_s = '皑蔼碍爱翱袄奥坝罢摆败颁办绊帮绑镑谤剥饱宝报鲍辈贝钡狈备惫绷笔毕毙闭边编贬变辩辫鳖瘪濒滨宾摈饼拨钵铂驳卜补参蚕残惭惨灿苍舱仓沧厕侧册测层诧搀掺蝉馋谗缠铲产阐颤场尝长偿肠厂畅钞车彻尘陈衬撑称惩诚骋痴迟驰耻齿炽冲虫宠畴踌筹绸丑橱厨锄雏础储触处传疮闯创锤纯绰辞词赐聪葱囱从丛凑窜错达带贷担单郸掸胆惮诞弹当挡党荡档捣岛祷导盗灯邓敌涤递缔点垫电淀钓调迭谍叠钉顶锭订东动栋冻斗犊独读赌镀锻断缎兑队对吨顿钝夺鹅额讹恶饿儿尔饵贰发罚阀珐矾钒烦范贩饭访纺飞废费纷坟奋愤粪丰枫锋风疯冯缝讽凤肤辐抚辅赋复负讣妇缚该钙盖干赶秆赣冈刚钢纲岗皋镐搁鸽阁铬个给龚宫巩贡钩沟构购够蛊顾剐关观馆惯贯广规硅归龟闺轨诡柜贵刽辊滚锅国过骇韩汉阂鹤贺横轰鸿红后壶护沪户哗华画划话怀坏欢环还缓换唤痪焕涣黄谎挥辉毁贿秽会烩汇讳诲绘荤浑伙获货祸击机积饥讥鸡绩缉极辑级挤几蓟剂济计记际继纪夹荚颊贾钾价驾歼监坚笺间艰缄茧检碱硷拣捡简俭减荐槛鉴践贱见键舰剑饯渐溅涧浆蒋桨奖讲酱胶浇骄娇搅铰矫侥脚饺缴绞轿较秸阶节茎惊经颈静镜径痉竞净纠厩旧驹举据锯惧剧鹃绢杰洁结诫届紧锦仅谨进晋烬尽劲荆觉决诀绝钧军骏开凯颗壳课垦恳抠库裤夸块侩宽矿旷况亏岿窥馈溃扩阔蜡腊莱来赖蓝栏拦篮阑兰澜谰揽览懒缆烂滥捞劳涝乐镭垒类泪篱离里鲤礼丽厉励砾历沥隶俩联莲连镰怜涟帘敛脸链恋炼练粮凉两辆谅疗辽镣猎临邻鳞凛赁龄铃凌灵岭领馏刘龙聋咙笼垄拢陇楼娄搂篓芦卢颅庐炉掳卤虏鲁赂禄录陆驴吕铝侣屡缕虑滤绿峦挛孪滦乱抡轮伦仑沦纶论萝罗逻锣箩骡骆络妈玛码蚂马骂吗买麦卖迈脉瞒馒蛮满谩猫锚铆贸么霉没镁门闷们锰梦谜弥觅绵缅庙灭悯闽鸣铭谬谋亩钠纳难挠脑恼闹馁腻撵捻酿鸟聂啮镊镍柠狞宁拧泞钮纽脓浓农疟诺欧鸥殴呕沤盘庞国爱赔喷鹏骗飘频贫苹凭评泼颇扑铺朴谱脐齐骑岂启气弃讫牵扦钎铅迁签谦钱钳潜浅谴堑枪呛墙蔷强抢锹桥乔侨翘窍窃钦亲轻氢倾顷请庆琼穷趋区躯驱龋颧权劝却鹊让饶扰绕热韧认纫荣绒软锐闰润洒萨鳃赛伞丧骚扫涩杀纱筛晒闪陕赡缮伤赏烧绍赊摄慑设绅审婶肾渗声绳胜圣师狮湿诗尸时蚀实识驶势释饰视试寿兽枢输书赎属术树竖数帅双谁税顺说硕烁丝饲耸怂颂讼诵擞苏诉肃虽绥岁孙损笋缩琐锁獭挞抬摊贪瘫滩坛谭谈叹汤烫涛绦腾誊锑题体屉条贴铁厅听烃铜统头图涂团颓蜕脱鸵驮驼椭洼袜弯湾顽万网韦违围为潍维苇伟伪纬谓卫温闻纹稳问瓮挝蜗涡窝呜钨乌诬无芜吴坞雾务误锡牺袭习铣戏细虾辖峡侠狭厦锨鲜纤咸贤衔闲显险现献县馅羡宪线厢镶乡详响项萧销晓啸蝎协挟携胁谐写泻谢锌衅兴汹锈绣虚嘘须许绪续轩悬选癣绚学勋询寻驯训讯逊压鸦鸭哑亚讶阉烟盐严颜阎艳厌砚彦谚验鸯杨扬疡阳痒养样瑶摇尧遥窑谣药爷页业叶医铱颐遗仪彝蚁艺亿忆义诣议谊译异绎荫阴银饮樱婴鹰应缨莹萤营荧蝇颖哟拥佣痈踊咏涌优忧邮铀犹游诱舆鱼渔娱与屿语吁御狱誉预驭鸳渊辕园员圆缘远愿约跃钥岳粤悦阅云郧匀陨运蕴酝晕韵杂灾载攒暂赞赃脏凿枣灶责择则泽贼赠扎札轧铡闸诈斋债毡盏斩辗崭栈战绽张涨帐账胀赵蛰辙锗这贞针侦诊镇阵挣睁狰帧郑证织职执纸挚掷帜质钟终种肿众诌轴皱昼骤猪诸诛烛瞩嘱贮铸筑驻专砖转赚桩庄装妆壮状锥赘坠缀谆浊兹资渍踪综总纵邹诅组钻致钟么为只凶准启板里雳余链泄';
var zh_t = '皚藹礙愛翺襖奧壩罷擺敗頒辦絆幫綁鎊謗剝飽寶報鮑輩貝鋇狽備憊繃筆畢斃閉邊編貶變辯辮鼈癟瀕濱賓擯餅撥缽鉑駁蔔補參蠶殘慚慘燦蒼艙倉滄廁側冊測層詫攙摻蟬饞讒纏鏟産闡顫場嘗長償腸廠暢鈔車徹塵陳襯撐稱懲誠騁癡遲馳恥齒熾沖蟲寵疇躊籌綢醜櫥廚鋤雛礎儲觸處傳瘡闖創錘純綽辭詞賜聰蔥囪從叢湊竄錯達帶貸擔單鄲撣膽憚誕彈當擋黨蕩檔搗島禱導盜燈鄧敵滌遞締點墊電澱釣調叠諜疊釘頂錠訂東動棟凍鬥犢獨讀賭鍍鍛斷緞兌隊對噸頓鈍奪鵝額訛惡餓兒爾餌貳發罰閥琺礬釩煩範販飯訪紡飛廢費紛墳奮憤糞豐楓鋒風瘋馮縫諷鳳膚輻撫輔賦複負訃婦縛該鈣蓋幹趕稈贛岡剛鋼綱崗臯鎬擱鴿閣鉻個給龔宮鞏貢鈎溝構購夠蠱顧剮關觀館慣貫廣規矽歸龜閨軌詭櫃貴劊輥滾鍋國過駭韓漢閡鶴賀橫轟鴻紅後壺護滬戶嘩華畫劃話懷壞歡環還緩換喚瘓煥渙黃謊揮輝毀賄穢會燴彙諱誨繪葷渾夥獲貨禍擊機積饑譏雞績緝極輯級擠幾薊劑濟計記際繼紀夾莢頰賈鉀價駕殲監堅箋間艱緘繭檢堿鹼揀撿簡儉減薦檻鑒踐賤見鍵艦劍餞漸濺澗漿蔣槳獎講醬膠澆驕嬌攪鉸矯僥腳餃繳絞轎較稭階節莖驚經頸靜鏡徑痙競淨糾廄舊駒舉據鋸懼劇鵑絹傑潔結誡屆緊錦僅謹進晉燼盡勁荊覺決訣絕鈞軍駿開凱顆殼課墾懇摳庫褲誇塊儈寬礦曠況虧巋窺饋潰擴闊蠟臘萊來賴藍欄攔籃闌蘭瀾讕攬覽懶纜爛濫撈勞澇樂鐳壘類淚籬離裏鯉禮麗厲勵礫曆瀝隸倆聯蓮連鐮憐漣簾斂臉鏈戀煉練糧涼兩輛諒療遼鐐獵臨鄰鱗凜賃齡鈴淩靈嶺領餾劉龍聾嚨籠壟攏隴樓婁摟簍蘆盧顱廬爐擄鹵虜魯賂祿錄陸驢呂鋁侶屢縷慮濾綠巒攣孿灤亂掄輪倫侖淪綸論蘿羅邏鑼籮騾駱絡媽瑪碼螞馬罵嗎買麥賣邁脈瞞饅蠻滿謾貓錨鉚貿麽黴沒鎂門悶們錳夢謎彌覓綿緬廟滅憫閩鳴銘謬謀畝鈉納難撓腦惱鬧餒膩攆撚釀鳥聶齧鑷鎳檸獰甯擰濘鈕紐膿濃農瘧諾歐鷗毆嘔漚盤龐國愛賠噴鵬騙飄頻貧蘋憑評潑頗撲鋪樸譜臍齊騎豈啓氣棄訖牽扡釺鉛遷簽謙錢鉗潛淺譴塹槍嗆牆薔強搶鍬橋喬僑翹竅竊欽親輕氫傾頃請慶瓊窮趨區軀驅齲顴權勸卻鵲讓饒擾繞熱韌認紉榮絨軟銳閏潤灑薩鰓賽傘喪騷掃澀殺紗篩曬閃陝贍繕傷賞燒紹賒攝懾設紳審嬸腎滲聲繩勝聖師獅濕詩屍時蝕實識駛勢釋飾視試壽獸樞輸書贖屬術樹豎數帥雙誰稅順說碩爍絲飼聳慫頌訟誦擻蘇訴肅雖綏歲孫損筍縮瑣鎖獺撻擡攤貪癱灘壇譚談歎湯燙濤縧騰謄銻題體屜條貼鐵廳聽烴銅統頭圖塗團頹蛻脫鴕馱駝橢窪襪彎灣頑萬網韋違圍爲濰維葦偉僞緯謂衛溫聞紋穩問甕撾蝸渦窩嗚鎢烏誣無蕪吳塢霧務誤錫犧襲習銑戲細蝦轄峽俠狹廈鍁鮮纖鹹賢銜閑顯險現獻縣餡羨憲線廂鑲鄉詳響項蕭銷曉嘯蠍協挾攜脅諧寫瀉謝鋅釁興洶鏽繡虛噓須許緒續軒懸選癬絢學勳詢尋馴訓訊遜壓鴉鴨啞亞訝閹煙鹽嚴顔閻豔厭硯彥諺驗鴦楊揚瘍陽癢養樣瑤搖堯遙窯謠藥爺頁業葉醫銥頤遺儀彜蟻藝億憶義詣議誼譯異繹蔭陰銀飲櫻嬰鷹應纓瑩螢營熒蠅穎喲擁傭癰踴詠湧優憂郵鈾猶遊誘輿魚漁娛與嶼語籲禦獄譽預馭鴛淵轅園員圓緣遠願約躍鑰嶽粵悅閱雲鄖勻隕運蘊醞暈韻雜災載攢暫贊贓髒鑿棗竈責擇則澤賊贈紮劄軋鍘閘詐齋債氈盞斬輾嶄棧戰綻張漲帳賬脹趙蟄轍鍺這貞針偵診鎮陣掙睜猙幀鄭證織職執紙摯擲幟質鍾終種腫衆謅軸皺晝驟豬諸誅燭矚囑貯鑄築駐專磚轉賺樁莊裝妝壯狀錐贅墜綴諄濁茲資漬蹤綜總縱鄒詛組鑽緻鐘麼為隻兇準啟闆裡靂餘鍊洩';
String.prototype.tran=function(){
	var s1,s2;
	if(zh_choose=='t'){
	   s1 = zh_s;
	   s2 = zh_t;
	}else if(zh_choose=='s'){
	   s1 = zh_t;
	   s2 = zh_s;
	}else{
	   return this;
	}
	var a = '';
	var l = this.length;
	for(var i=0;i<this.length;i++){
		var c = this.charAt(i);
		var p = s1.indexOf(c);
		a += p < 0 ? c : s2.charAt(p);
	}
	return a;
}

function setCookie(name, value) {  
	localStorage[name] = value;
}
function getCookie(name)
{
	return localStorage[name];
}
function zh_tranBody(obj){
	var o = (typeof(obj) == "object") ? obj.childNodes : document.body.childNodes;
	for (var i = 0; i < o.length; i++){
		var c = o.item(i);
		if('||BR|HR|TEXTAREA|SCRIPT|'.indexOf("|"+c.tagName+"|") > 0) continue;
		if(c.className == zh_class){
			if(c.id == zh_class + '_' + zh_choose){
				c.setAttribute('style', zh_style_active);
				c.style.cssText = zh_style_active;
			}else{
				c.setAttribute('style', zh_style_inactive);
				c.style.cssText = zh_style_inactive;
			}
			continue;   
		}
		if(c.title != '' && c.title != null){
			c.title = c.title.tran();
		}
		if(c.alt != '' && c.alt != null){
			c.alt = c.alt.tran();
		}
		if(c.tagName == "INPUT" && c.value != '' && c.type != 'text' && c.type != 'hidden' && c.type != 'password'){
			c.value = c.value.tran();
		}
		if(c.nodeType == 3){
			c.data = c.data.tran();  
		}else{
			zh_tranBody(c);
		}
	}
}
function zh_tran(go){
	if(go) zh_choose = go;
	setCookie('zh_choose', zh_choose);
	if(go == 'n'){
	   window.location.reload();
	}else {
	   zh_tranBody();
	}
}
function zh_getLang(){
	if(getCookie('zh_choose')){
	   zh_choose = getCookie('zh_choose');
	   return true;
	}
	if(!zh_autoLang_t && !zh_autoLang_s){
		return false;
	}
	if(getCookie('zh_autoLang_checked')){
		return false;
	}
	if(navigator.language){
		zh_browserLang = navigator.language;
	}else if(navigator.browserLanguage){
		zh_browserLang = navigator.browserLanguage;
	}
	if(zh_autoLang_t && zh_langReg_t.test(zh_browserLang)){
		zh_choose = 't';
	}else if(zh_autoLang_s && zh_langReg_s.test(zh_browserLang)){
		zh_choose = 's';
	}
	zh_autoLang_checked = 1;
	setCookie('zh_choose', zh_choose);
	if(zh_choose == zh_default){
		return false;
	}
	return true;
}
function zh_init(){
	zh_getLang();
	c = document.getElementById(zh_class + '_' + zh_choose);
	if(zh_choose != zh_default){
		if(window.onload){
			window.onload_before_zh_init = window.onload;
			window.onload = function(){
				zh_tran(zh_choose);
				if(zh_autoLang_alert){
					
				};
				window.onload_before_zh_init();
			};
		}else{
			window.onload = function(){
				zh_tran(zh_choose);
				if(zh_autoLang_alert){
				
				};
			};
		}
	}
}

function getQueryString(name) {
var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
var r = window.location.search.substr(1).match(reg);
if (r != null) return unescape(r[2]); return null;
}

lang = getQueryString("lang")

if(lang=='zh'){
zh_tran('s');
}
if(lang=='hk'){
zh_tran('t');
}


	zh_init();
	
	console.log(getCookie('zh_choose'))


使用方法

<dd><a href="javascript:zh_tran('s');" class="zh_click" id="zh_click_s">中文版</a></dd>
<dd><a href="javascript:zh_tran('t');" class="zh_click" id="zh_click_t">繁軆中文</a></dd>

也可以使用url的方法

<li><a href="/?lang=zh">简体中文</a></li>
<li><a href="/?lang=hk">繁軆中文</a></li>


39js获取url参数

function getQueryString(name) {
    var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
    var r = window.location.search.substr(1).match(reg);
    if (r != null) return unescape(r[2]); return null;
    }

获取参数

name = GetQueryString("name")


38php post 请求

function curl_post($url, $data) {

   //初使化init方法
   $ch = curl_init();

   //指定URL
   curl_setopt($ch, CURLOPT_URL, $url);

   //设定请求后返回结果
   curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1);

   //声明使用POST方式来进行发送
   curl_setopt($ch, CURLOPT_POST, 1);

   //发送什么数据呢
   curl_setopt($ch, CURLOPT_POSTFIELDS, $data);


   //忽略证书
   curl_setopt($ch, CURLOPT_SSL_VERIFYPEER, false);
   curl_setopt($ch, CURLOPT_SSL_VERIFYHOST, false);

   //忽略header头信息
   curl_setopt($ch, CURLOPT_HEADER, 0);

   //设置超时时间
   curl_setopt($ch, CURLOPT_TIMEOUT, 10);

   //发送请求
   $output = curl_exec($ch);

   //关闭curl
   curl_close($ch);

   //返回数据
   return json_decode($output,true);
}


使用方法

$url = "https://api.weixin.qq.com/cgi-bin/qrcode/create?access_token=" . $access_tokens . "";
        # 生成二维码需要的参数
        $qrcode = '{"expire_seconds": 1800, "action_name": "QR_SCENE", "action_info": {"scene": {"scene_id": ' . $orderId . '}}}';
        $result =  curl_post($url, $qrcode);


37js 获取今天日期年月日时间

function init(){
	var date=new Date();
	//年
    var year=date.getFullYear();
    //月
    var month=date.getMonth()+1;
    //日
    var day=date.getDate();
    //时
    var hh=date.getHours();
    //分
    var mm=date.getMinutes();
    //秒
    var ss=date.getSeconds();
    var rq=year+"年"+month+"月"+day+"日"+hh+":"+mm+":"+ss;
    document.getElementById("rq").innerHTML=rq;
}


36js获取url#后面参数

http://localhost:62683/youli/product.htm#0 

alert(GetRequest());

//获取#号值
function GetRequest() {
  var str = location.href
  var num = str.indexOf("#");
  str = str.substr(num + 1);
  return str;
}


35css3渐变色


上下渐变

.box{
  background: -webkit-linear-gradient(red, blue); /* Safari 5.1 - 6.0 */
  background: -o-linear-gradient(red, blue); /* Opera 11.1 - 12.0 */
  background: -moz-linear-gradient(red, blue); /* Firefox 3.6 - 15 */
  background: linear-gradient(red, blue); /* 标准的语法 */
}


左右渐变色


.box{
            width: 300px;
            height: 300px;
            background: -webkit-linear-gradient(left, red , blue); /* Safari 5.1 - 6.0 */
            background: -o-linear-gradient(right, red, blue); /* Opera 11.1 - 12.0 */
            background: -moz-linear-gradient(right, red, blue); /* Firefox 3.6 - 15 */
            background: linear-gradient(to right, red , blue); /* 标准的语法 */
        }


34延迟菜单,不在li里面的菜单怎么做

	$('.open').hover(function(){
		$('.ul-topnews').show(0);
	},function(){
		 myVar = setTimeout(function(){ 
			$('.ul-topnews').hide(0);
		}, 500);
	})
	
	$('.ul-topnews').hover(function(){
		clearTimeout(myVar);
	},function(){
		$('.ul-topnews').hide(0);
	})


HTML

<a class="open">鼠标经过展示</a>
<ul class="ul-topnews" style="display:none;">
<li>选项一</li>
<li>选项一</li>
<li>选项一</li>
</ul>


33iso 禁止弹性拖动,禁止页面拖动

document.ontouchmove = function(e) {
   e.preventDefault();
}


32ipad,ios 链接点两次才跳转

$(document).ready(function() {

   $('a').on('click touchend', function(e) {
      var el = $(this);
      var link = el.attr('href');
      window.location = link;
   });});


原因:第一次是触发了hover样式

<<<123>>>