背景:有人想要个简单的js效果,点击某个菜单,其他菜单收起。

说了下思路,结果~~

只好直接写了一个,代码如下:

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Title</title>
<script type="text/javascript" src="js/jquery-1.11.3.min.js"/>
<script type="text/javascript">
$(function () {
alert("sdfsfd");
$(".content").hide();
});
$(".menu").click(function () {
$(".content").hide();
$(this).siblings().show();
}); </script> </head>
<body> <div>
<div class="menu">标题</div>
<div class="content">AAAAAAAAAAAAAAAA<br/>BBBBBBBBBBBBBBBB<br/>CCCCCCCCCCCCCCCC<br/>DDDDDDDDDDDDDDDD<br/>EEEEEEEEEEEEEEEE<br/>
</div>
</div>
<div>
<div class="menu">标题</div>
<div class="content">AAAAAAAAAAAAAAAA<br/>BBBBBBBBBBBBBBBB<br/>CCCCCCCCCCCCCCCC<br/>DDDDDDDDDDDDDDDD<br/>EEEEEEEEEEEEEEEE<br/>
</div>
</div>
<div>
<div class="menu">标题</div>
<div class="content">AAAAAAAAAAAAAAAA<br/>BBBBBBBBBBBBBBBB<br/>CCCCCCCCCCCCCCCC<br/>DDDDDDDDDDDDDDDD<br/>EEEEEEEEEEEEEEEE<br/>
</div>
</div>
<div>
<div class="menu">标题</div>
<div class="content">AAAAAAAAAAAAAAAA<br/>BBBBBBBBBBBBBBBB<br/>CCCCCCCCCCCCCCCC<br/>DDDDDDDDDDDDDDDD<br/>EEEEEEEEEEEEEEEE<br/>
</div>
</div>
<div>
<div class="menu">标题</div>
<div class="content">AAAAAAAAAAAAAAAA<br/>BBBBBBBBBBBBBBBB<br/>CCCCCCCCCCCCCCCC<br/>DDDDDDDDDDDDDDDD<br/>EEEEEEEEEEEEEEEE<br/>
</div>
</div>
<div>
<div class="menu">标题</div>
<div class="content">AAAAAAAAAAAAAAAA<br/>BBBBBBBBBBBBBBBB<br/>CCCCCCCCCCCCCCCC<br/>DDDDDDDDDDDDDDDD<br/>EEEEEEEEEEEEEEEE<br/>
</div>
</div> </body>
</html>

但是,jQuery代码一行都没执行!!!

略过期间吐血的反复试alert(),直接说结论吧:

导入script的标签,不能自闭合!!!

就是不能写成这样:<script src="..."/>

而需要写成这样:<script src="..."></script>

否则后面的第一个<script>标签整体不会执行!!!

但是不会影响第二个及以后的<script>标签。。。

如下:

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Title</title>
<script type="text/javascript" src="js/jquery-1.11.3.min.js" ></script> <!--不能合并-->
<script type="text/javascript">
$(function () {
$(".content").hide();
});
$(".menu").click(function () {
$(".content").hide();
$(this).siblings().show();
});
</script> </head>
<body> <div>
<div class="menu">标题</div>
<div class="content">AAAAAAAAAAAAAAAA<br/>BBBBBBBBBBBBBBBB<br/>CCCCCCCCCCCCCCCC<br/>DDDDDDDDDDDDDDDD<br/>EEEEEEEEEEEEEEEE<br/>
</div>
</div>
<div>
<div class="menu">标题</div>
<div class="content">AAAAAAAAAAAAAAAA<br/>BBBBBBBBBBBBBBBB<br/>CCCCCCCCCCCCCCCC<br/>DDDDDDDDDDDDDDDD<br/>EEEEEEEEEEEEEEEE<br/>
</div>
</div>
<div>
<div class="menu">标题</div>
<div class="content">AAAAAAAAAAAAAAAA<br/>BBBBBBBBBBBBBBBB<br/>CCCCCCCCCCCCCCCC<br/>DDDDDDDDDDDDDDDD<br/>EEEEEEEEEEEEEEEE<br/>
</div>
</div>
<div>
<div class="menu">标题</div>
<div class="content">AAAAAAAAAAAAAAAA<br/>BBBBBBBBBBBBBBBB<br/>CCCCCCCCCCCCCCCC<br/>DDDDDDDDDDDDDDDD<br/>EEEEEEEEEEEEEEEE<br/>
</div>
</div>
<div>
<div class="menu">标题</div>
<div class="content">AAAAAAAAAAAAAAAA<br/>BBBBBBBBBBBBBBBB<br/>CCCCCCCCCCCCCCCC<br/>DDDDDDDDDDDDDDDD<br/>EEEEEEEEEEEEEEEE<br/>
</div>
</div>
<div>
<div class="menu">标题</div>
<div class="content">AAAAAAAAAAAAAAAA<br/>BBBBBBBBBBBBBBBB<br/>CCCCCCCCCCCCCCCC<br/>DDDDDDDDDDDDDDDD<br/>EEEEEEEEEEEEEEEE<br/>
</div>
</div> </body>
</html>

奇怪的bug:javascript不执行的更多相关文章

  1. javascript的执行顺序(转载)

    之前从JavaScript引擎的解析机制来探索JavaScript的工作原理,下面我们以更形象的示例来说明JavaScript代码在页面中的执行顺序.如果说,JavaScript引擎的工作机制比较深奥 ...

  2. Javascript的执行过程详细研究

    下面我们以更形象的示例来说明JavaScript代码在页面中的执行顺序.如果说,JavaScript引擎的工作机制比较深奥是因为它属于底层行为,那么JavaScript代码执行顺序就比较形象了,因为我 ...

  3. 奇怪的BUG

    熟语说“常在河边走,哪能不湿鞋”,在现实中我想说:“代码写多了,总会遇到奇怪的bug”,遇到bug不可怕,可怕的是不自己不知道这么解决,有些bug能当时解决,有些在自己知识水平提高后知道如何解决.还有 ...

  4. JavaScript的执行上下文

    在JavaScript的运行过程中,经常会遇到一些"奇怪"的行为,不理解为什么JavaScript会这么工作. 这时候可能就需要了解一下JavaScript执行过程中的相关内容了. ...

  5. javaScript代码执行顺序

    javaScript是一种描述型脚本语言,由浏览器进行动态的解析和执行. 页面加载过程中,浏览器会对页面上载入的每个js代码块进行扫描. JavaScript是一段一段的分析执行的,在分析执行同一段代 ...

  6. javascript立即执行函数

    javascript和其他编程语言相比比较随意,所以javascript代码中充满各种奇葩的写法,有时雾里看花;当然,能理解各型各色的写法也是对javascript语言特性更进一步的深入理解.  ( ...

  7. JavaScript 立即执行函数

    js中(function(){…})()立即执行函数写法理解 javascript和其他编程语言相比比较随意,所以javascript代码中充满各种奇葩的写法,有时雾里看花,当然,能理解各型各色的写法 ...

  8. 深入理解javascript中执行环境(作用域)与作用域链

    深入理解javascript中执行环境(作用域)与作用域链 相信很多初学者对与javascript中的执行环境与作用域链不能很好的理解,这里,我会按照自己的理解同大家一起分享. 一般情况下,我们把执行 ...

  9. javascript立即执行函数 (function(){})()

    看到一段代码: (function(){ var outer = $('#subject'); outer.find('li').on('mouseover', mouseover); })() ( ...

  10. 深入理解JavaScript系列+ 深入理解javascript之执行上下文

    http://www.cnblogs.com/TomXu/archive/2011/12/15/2288411.html http://blog.csdn.net/hi_kevin/article/d ...

随机推荐

  1. ORACLE11g中毒恢复

    很不幸的,win2003server疏于管理,中毒了,清理了病毒以后.oracle也瘫痪了.上次备份还在一周前,这一周的数据咋办? 首先的想法,是另找一台机器,装个一模一样的oracle.再把被删的文 ...

  2. Spring AOP之Introduction(@DeclareParents)简介(转)

    Spring的文档上对Introduction这个概念和相关的注解@DeclareParents作了如下介绍: Introductions (known as inter-type declarati ...

  3. Xilinx ISE Design Suite 14.7 ISim 简单仿真

    1.创建完项目(以Xilinx ISE Design Suite 14.7开发流程的例子    led例子   为例),编译通过,我们就可以对这个项目进行仿真: 2.然后切换到simulation,然 ...

  4. JVM总结篇

    Sun HotSpot VM,是JDK和Open JDK中自带的虚拟机,也是目前使用范围最广的Java虚拟机. JVM内存分布 程序计数器:是一块较小的内存空间,可以看作是当前线程所执行的字节码的行号 ...

  5. Django——model基础

      ORM 映射关系: 表名 <-------> 类名 字段 <-------> 属性 表记录 <------->类实例对象 创建表(建立模型) 实例:我们来假定下 ...

  6. Ubuntu12.04下tomcat的安装与配置

    1.下载tomcat 我的tomcat是从 http://tomcat.apache.org/download-70.cgi 这里下载的tar.gz版本的. 2.解压tomcat $sudo tar ...

  7. ftp实现文件上传(下载)

    例子代码 package getUrlPic; import java.io.ByteArrayInputStream; import java.io.IOException; import java ...

  8. less css框架的学习

    什么是LESSCSS LESSCSS是一种动态样式语言,属于CSS预处理语言的一种,它使用类似CSS的语法,为CSS的赋予了动态语言的特性,如变量.继承.运算.函数等,更方便CSS的编写和维护. LE ...

  9. python 合并字典,相同 key 的 value 如何相加?

    x = { 'apple': 1, 'banana': 2 } y = { 'banana': 10, 'pear': 11 } 需要把两个字典合并,最后输出结果是: { 'apple': 1, 'b ...

  10. c++重载>>和<<

    在重载输出输入运算符的时候,只能采用全局函数的方式(因为我们不能在ostream和istream类中编写成员函数),这里才是友元函数真正的应用场景.对于输出运算符,主要负责打印对象的内容而非控制格式, ...