jquery 不识别 div 点击答案

【问题标题】：jquery doesnt recognize div clickjquery 不识别 div 点击
【发布时间】：2012-10-01 18:49:32
【问题描述】：

我有以下代码。我的问题是，当我单击 div maya 时，jquery 无法识别它并且它不会给我警报。

CSS

   <style>
   #carousel-single-image {
   width: 320px;
   height: 400px;
   margin: 0 auto;
   background: white;
   }
   #carousel-single-image .touchcarousel-container {
   height: 100%;
   background: url("../touchcarousel/demo-images/wood-pattern.jpg") repeat;
   }
   #carousel-single-image .touchcarousel-item {
   margin-right: 0;
   width: 400px;
   height: 400px;
   }
   #carousel-single-image img {
   width: 300px;
   height: 360px;
   margin: 32px 0 0 8px;
   float:left;
   position: relative;
   display: block;
   padding: 3px;
   background: transparent;
   border: 0;
   -webkit-box-shadow: 0 1px 6px rgba(0,0,0,0.6);
   -moz-box-shadow: 0 1px 6px rgba(0,0,0,0.6);
   box-shadow: 0 1px 6px rgba(0,0,0,0.6);
   }
   #carousel-single-image .tc-paging-container {
   margin-top: -380px;
   }
</style>

HTML

<div id="productGallery" style="display:none">
   <div id="main-body">
      <div id="carousel-single-image" class="touchcarousel minimal-light">
         <ul class="touchcarousel-container">
            <li class="touchcarousel-item">
               <a href="#"> <img data-original="/image1.jpg" />
               <span class="maya">CheckClick</span></a>
            </li>
            <li class="touchcarousel-item">
               <a href="#"> <img data-original="/image2.jpg" />
               <span class="maya">CheckClick</span></a>
            </li>
         </ul>
      </div>
   </div>
</div>

脚本

$('.maya').click(function(){
alert("hi");
});

【问题讨论】：

你包括jQuery吗？您的 jQuery 代码是否包含在 <script> 标签中？
你能在这不起作用的地方创建一个小提琴吗？也许您有另一个 div 与 Maya 具有相同的内容但不是同一类，所以您认为您正在单击 Maya？它有任何错误吗？

标签： jquery jquery-ui jquery-selectors

【解决方案1】：

包含在 DOM Ready Event 中，并将您的脚本包含在脚本标签中

<script type="text/javascript">
    $(function() {
        $('.maya').click(function(){
            alert("hi");
        });
    });
</script>

还要确保 jQuery 文件包含在您的项目中。..

好像是working HERE

【讨论】：

那没用。我已经有 $('.maya').click(function(){ alert("hi"); });在文档准备好的单独的 js 文件中..谢谢
您是否包含该文件？？

【解决方案2】：

这是一个有效的小提琴......我只在你的整个容器上取出了 display none 样式，所以我可以看到它http://jsfiddle.net/wcLn4/

这个带有你的 css http://jsfiddle.net/wcLn4/1/ 并且不显示任何内容

【讨论】：