获取div的一些文本节点并将事件绑定到父div

时间:2010-12-05 23:54:13

标签: jquery jquery-selectors

我浪费了一些时间来了解如何做简单的事情: 我想从一些 li div.joomimg24_imgct div.joomimg24_txt ul li中获取一些文本并将此类的所有div绑定到一个事件(我想得到每个div.joomimg24_imgct div的索引,如果它是可能)。 例如,如果我有:

author : 0 
comments 1

我想将0和1保存到变量并隐藏div.joomimg24_txt,然后用变量做。 问题是我甚至无法操作div.joomimg24_txt。

我已经拥有:

jQuery("div.joomimg24_imgct option").each(function() {
 jQuery(this).bind({
   mouseenter: function(){
   // get a text  of each li in div.joomimg24_txt ul and save it, hide div
   //  jQuery(this ).index(jQuery("div.joomimg24_txt")).hide();  //it dont work
   //  jQuery(this ).(jQuery("div.joomimg24_txt")).hide();      //it dont work
   // create a Pop-up, so I'd be nice to know x,y of *this*

  },
  mouseleave: function(){
  }
})
});

2 个答案:

答案 0 :(得分:3)

jQuery("div.joomimg24_imgct option").hover(function() {
   // mouse enter

   var index = $(this).index();

}, function() {
   // mouse leave
});

答案 1 :(得分:0)

我一直在努力实现我想要的效果,但现在一切正常。也许对某人有用: 这是JoomImages(JoomGallery,Joomla)的弹出窗口,可以将描述更改为弹出窗口:

<?php if(JRequest::getVar('view') == "frontpage" ) :   //You are in frontpage! Podmiana opisów?>





<script type="text/javascript" src="jquery.qtip-1.0.0.js"></script>



<script type="text/javascript" >


jQuery("div.joomimg24_imgct").each(function() {
      //  $(this) = this current hyperlink
//var elem = $(this).get(0);
jQuery(this).find(".joomimg24_txt").hide();  
// why it doesn't work on real page, works on static page

 var textField = jQuery(this).find(".joomimg24_txt ul li") ;
 var title = textField.get(0).innerHTML ;
 var author = textField.get(1).innerHTML.split(':')[1] ;
 var commnetsC = textField.get(3).innerHTML.split(':')[1] ;

var newText = "<table cellspacing=\"0\" cellpadding=\"0\" border=\"0\" style=\"\" class=\"box\"> \n\
<tbody><tr> <td class=\"tl\"></td> <td class=\"t\"> </td><td class=\"tr\"> \n\
</td></tr> <tr> <td class=\"l\"> </td><td class=\"content\"> <table width=\"30\"\n\
 cellpadding=\"4\" style=\"width: x; margin: auto; font-size: 11px; line-height: 14px;\"> \n\
<tbody><tr> <td width=\"50\" class=\"td0\" style=\"width: 100px;\"> tytuł:</td> \n\
<td width=\"50\" class=\"td0\" style=\"width: 130px;\"><span class=\"td0\" style=\"width: 100px;\">\n\
" + title + "</span></td> </tr> <tr> <td class=\"td1\">autor:</td> <td class=\"td1\">\n\
 " + author + "</td> </tr> <tr> <td class=\"td1\">ilość komentarzy</td> <td class=\"td1\">\n\
  " + " &nbsp&nbsp  " + commnetsC +"</td> </tr> <tr> <td class=\"td1\">&nbsp;</td> <td class=\"td1\">&nbsp;</td> </tr> </tbody></table> </td> <td class=\"r\"> </td></tr> <tr> <td class=\"bl\"> </td><td class=\"b\"> </td><td class=\"br\"> </td></tr> </tbody></table>";



 jQuery(this).qtip({
   content: newText,
   show: 'mouseover',
   hide: 'mouseout',
   position: {
      corner: {
         target: 'bottomMiddle',
         tooltip: 'topMiddle'
      }
   },

    style: { 
      width: 150,
      padding: 2,
      marginRight: 20,
     // background:  'url("../images/bg-slide.jpg") repeat scroll 0 0 transparent',
      background: 'url(/joomla/templates/upsilum/images/bg-slide.jpg)',
      color: 'white',

      border: {
         width: 5,
         radius: 4,
         color: '#CCC'
      }


    }

 })







})



jQuery(".joomimg24_txt").hide();   
// The firs try to hide doesnt work!  Need to wait for all doc to read?


</script>

<?php endif; ?>