【blog项目】layui与jquery冲突导致鼠标悬停事件失效、如何调用layui.use作用域里的方法-3 相关代码

<script src="/static/jquery-2.1.4.js"></script>
<script src="/static/layui/layui.js"></script>
<script src="/static/js/yss/gloable.js"></script>
<script src="/static/js/plugins/nprogress.js"></script>
<script>NProgress.start();</script>
<script src="/static/js/yss/article.js"></script>
$.post(
	'/blog?method=selectBlogType',
	function (result) {
		if (result.code === 0) {
			console.log(result.data);
			var i = 2;
			$(result.data).each(function (){
				console.log(this.name);
				var html = '';
				/*<li data-index="3"><a href="/Blog/Article/2/" onClick="selectByType('1')">HTML5&amp;CSS3</a></li>*/
				html += '<li data-index="'+ i +'"><a href="javascript:void(0)" οnclick="selectByType('+ this.id +', null)">' + this.name +'</a></li>';
				$('#category').append(html);
				i++;
			});
		}
	},
	'json'
)

其余部分:

layui.use(['form'], function(){
			var form = layui.form;

			// 搜索提交
			form.on('submit(submitSearch)', function(data){
				var field = data.field; // 获得表单字段JSON格式
				//console.log(field);//title
				selectByType(null, field.title);
				return false; // 阻止默认 form 跳转
			});
		});

		function selectByType(typeId, title) {
			$.post(//抽取成方法 直接放到function里边就行
				'/blog?method=selectByType',
				{'typeId': typeId,'title': title},
				function (result) {
					if(result.code === 0) {
						$('#LAY_bloglist').empty();
						$(result.data).each(function (){
							//js切割日期并展示
							var html = '';
							html += '<section class="article-item zoomIn article">';
							html += '	<div class="fc-flag">置顶</div>';
							html += '	<h5 class="title">';
							html += '		<span class="fc-blue">【原创】</span>';
							html += '		<a href="read.html">'+this.title+'</a>';
							html += '	</h5>';
							html += '	<div class="time">';
							html += '		<span class="day">21</span>';
							html += '		<span class="month fs-18">1<span class="fs-14">月</span></span>';
							html += '		<span class="year fs-18 ml10">'+ this.createTime +'</span>';
							html += '	</div>';
							html += '	<div class="content" style="height: 180px; overflow:hidden">';
							html += '		<a href="read.html" class="cover img-light">';
							html += '			<img src="/pic/'+ this.image +'">';
							html += '		</a>';
							html += '		'+ this.content +'';
							html += '	</div>';
							html += '	<div class="read-more">';
							html += '		<a href="read.html" class="fc-black f-fwb">继续阅读</a>';
							html += '	</div>';
							html += '	<aside class="f-oh footer">';
							html += '		<div class="f-fl tags">';
							html += '			<span class="fa fa-tags fs-16"></span>';
							html += '			<a class="tag">ASP.NET MVC</a>';
							html += '		</div>';
							html += '		<div class="f-fr">';
							html += '		<span class="read">';
							html += '			<i class="fa fa-eye fs-16"></i>';
							html += '			<i class="num">57</i>';
							html += '		</span>';
							html += '			<span class="ml20">';
							html += '			<i class="fa fa-comments fs-16"></i>';
							html += '			<a href="javascript:void(0)" class="num fc-grey">1</a>';
							html += '		</span>';
							html += '		</div>';
							html += '	</aside>';
							html += '</section>';

							$('#LAY_bloglist').append(html);
						})
					}
				},
				'json'
			);
		}
上一篇:探索设计模式的魅力:开启智慧之旅,AI与机器学习驱动的微服务设计模式探索


下一篇:浏览器——Microsoft Edge