前言 vue一个重要的方面就是路由，下面是自己写的一个路由的例子分享给大家供大家参考学习，下面来看看详细的介绍。 方法如下： 1、引入依赖库就不必再说 2、创建组件 两种写法 第一种：间接<template id="home"><div><h1>Home</h1><p>{{msg}}</p></div></template>var About = Vue.extend({template: #about});第二种：直接var Out = Vue.extend({template: <div><h1>Out</h1><p>This is the tutorial out vue-router.</p></div>}...
前言 最近练习Vue，看到官方文档中的嵌套路由，不做不知道，实在是太坑了，网上资料demo少之又少，然后自己就做了一个demo,用了vue2.0嵌套路由实现豆瓣电影分页功能，供大家学习学习，写得不好望见谅。 demo截图：Demo简单介绍 主路由：Top250(charts)，正在热映(hot)，即将上映(ing)，新片榜(newmovie) const router = new VueRouter({routes: [{path: /, //设置默认路由为Top250component: charts},{path: /charts, //Top250com...
这里是父子模版的调用 这里是针对于vue1.0，如果要学2.0，建议大家去看官方文档vue2.0 ：http://vuefe.cn/guide/vue-router2.0： https://router.vuejs.org/zh-cn/essentials/getting-started.html 第一种，子组件模版直接写在js里//定义模版挂载点my-component <div id="exampleBox1"> <com-ponent></com-ponent> </div> <script src="../vue/node_modules/vue/dist/vue.js"></script> <script> var Component = Vue.extend({// 定...
先看下面一段代码： for(var i=0; i<10; i++) {$(#ul).bind(click, function() {alert(i)}) }对于这段代码，当点击Id为“ul”的元素时，会出现弹出10个10。为什么会弹出10个10呢？ 首先，这段代码中的点击事件不是绑定事件，是jQuery的绑定事件，那么绑定事件和普通事件是有区别的。普通事件中，如果对某一个元素添加多个点击事件，那么，最后一个将会把前面的所有点击事件全部覆盖，只能执行最后一个点击事件；而在绑定事件中，则...
模板抽离 我们已经学习过了Vue模板的另外定义形式，使用<template></template>。<!-- 模板抽离出来 --><template id="home"><div>首页</div></template><template id="news"><div>新闻</div></template> 然后js里定义路由组件的时候：// 1. 定义（路由）组件。const Home = { template: #home };const News = { template: #news };路由嵌套 实际应用界面，通常由多层嵌套的组件组合而成。 比如，我们 “首页”组件中，还嵌套着 “登...
如果一段html嵌套过多，在js中获取还是比较麻烦的，我写了几套方案，大家可以参考参考，如果你有好的方法，也分享出来，让我们瞧瞧。HTML：<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>元素多层嵌套，JS获取问题</title> </head> <body> <div id="box"> <span>span</span> <div> <span>span</span> <a href=""> <span>1</span> </a> </div> <div> <a href=""> <span>2</span> </a> </div> <div> <a hr...
废话不多说了，直接贴代码了。 具体代码如下所示： <script> function openWindow(){ var my=confirm("你要打开窗口吗？") if(my==true){ var url=prompt("通过输入对话框，确定打开的网址","http://www.imooc.com") if(url!=null){ window.open(htttp://www.refw.org.cn,_blank,width=300,height=300,scrollbars=no,menubar=no)} else{ alert(不打开); } /*if嵌套*/ } else{ alert("88") } } </script> <body> <input type="butt...
关于选项卡功能大家一定都不会陌生，无非就是鼠标点击或者悬浮能够切换相关的内容。 通常情况下，大家见到的选项卡都是没有嵌套功能的，也就是说就是完成了一层切换效果，本章节分享一段代码实例，实现了选项卡的嵌套功能，也就是选项卡中嵌套有选项卡功能，也就能够容纳更多的内容。 代码如下:<head> <meta charset="gb2312"> <title>jquery选项卡</title> <style type="text/css"> body, ul, li, div, a{margin:0px;padding:0px;...
我们都知道在函数中定义的局部变量在声明他的函数体以及其嵌套的函数内始终是有定义的，并且在函数的作用域链上始终会有个对象指向全局对象，使函数能够访问到全局变量。 var ga = global; var func = function() {var la = local;return function() {return function(){return function(){alert(la);alert(ga);}}}} a = func(); a()()();// 弹出 local 和 global那么在外部定义的函数A， 被函数B在函数体内调用时，A能访问到B中定...
在JavaScript1.2之前，函数定义是只允许在顶层全局代码，但1.2的JavaScript可以嵌套函数定义其他函数中也是可以的。 仍然存在的函数定义可以循环或条件之内不会出现限制。在函数定义这些限制只适用于函数声明与函数语句。 函数文本(在JavaScript1.2引入的另一个功能)可能出现在任何JavaScript表达式，这意味着它们可以出现在if else语句内。 示例: 下面就是我们两个嵌套函数的例子。这可能会有点混乱，但它的工作原理完全正常： <s...
代码如下:var i=0; function addForm(){ i++; var textExtra=<p><input type="text" name=+"addInput"+i+ class="addInp"/></p>; $("#inforForm").append(textExtra); } 实现的效果是点击增加一个文本框进表单里面，自动命名name，被单引号双引号的嵌套搞得头大……
注意：function(i){}可以带 i ，表示index。以及JavaScript对象 代码如下:var startObj = {}; //申明js对象 $("#tabT").find("tr").each(function(i){ var uuid = ; $(this).find("input[type=hidden]").each(function(j){ if(j==0){ uuid = $(this).val(); } startObj[uuid+_+j] = $(this).val(); }); }); $("#tabT").find("tr").each(function() { var sameFlag = "1"; var uuid = ; $(this).find("input[type=hidden]").each(f...
代码如下:<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <script> var stu ={ m: function(){ var self = this; console.log(this === stu); // ==> true; function f(){ // 调用嵌套函数时this不是指向调用外层函数的上下文 console.log(this === stu); // ==> false; 如果想访问外部函数的this需要将外部函数的this保存在一个变量中。 console.log(self === stu); // ==> tr...
检查bug的步骤 1. bug定位 在js脚本中，按照脚本执行的顺序，你可以用console或alert，来确定bug发生的代码区间，然后在区间内进一步来查找bug发生的具体代码段。 2. bug fix 通过排除，就是在插入节点内容的时候导致了bug，我用的是kissy的DOM.html()方法，其功能类似于DOM元素节点innerHTML方法，我起初认为是这个方法导致的IE6\7渲染出错，然后我换成了innerHTML方法，结果还是有误。 这时候我想到了内存泄露，看看是不是在循环...
HTML 端： PART 1： 代码如下:{{foreach from=$question.question_item item="it" name="question_item"}} <tr> <td align="left">{{$it.item_id}}</td> <td align="left">{{$it.item_name}}</td> <td align="left">9 <input type="hidden" class="swfhdn" value="{title:{{$it.item_name}},vote:12票,proportion:0.25,singleId:swfdv{{$key+1}}}"/></td> </tr> {{/foreach}} PART 2： 代码如下:<div style="width:190px; heigh...