Question

我有以下代码。我的问题是当我点击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");
});

Answer 1

在DOM Ready事件中附上，脚本中的脚本标记

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

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

似乎是working HERE

Answer 2

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

这个与您的css http://jsfiddle.net/wcLn4/1/并且没有显示无

jquery不识别div click

2 个答案: