jquery Some instructions on the use of event.target_jquery

event.target
Description: The DOM element that triggered the event.

The difference between this and event.target
Events in js will bubble up, so this can change, but event.target will not change, it will always be direct The target DOM element that accepts the event;

The similarities between this and event.target
This and event.target are both DOM objects. If you want to use the methods in jquey, you can convert them into jquery objects: $(this) and $(event.target);

This reminds me of an example I wrote before:

Copy code The code is as follows:

//del event
$(".del").bind("click",function(event){
var _tmpQuery=$(this);//Why add it This sentence?
var id=$("input[name='id']",$(this).parents("form:first")).attr("value");
art. dialog.confirm ('Do you confirm that the log is deleted?', Function () {
$ .post ("Myrun/ManagerLog_del.php", {id: id}, function (tips) {
if (tips =='ok'){
art.dialog.tips('successfully deleted');
$(_tmpQuery.parents('tr:first')).hide();//If you don’t add the first Sentence, use $($(this).parents('tr:first')).hide(); will not hide
                                                                                                                                                                                               // Because this here is not the current class="del" DOM Object. But jQuery’s AJAX configuration object ajaxSettings.
🎜>          }) ;
                 return true;
         }); There is no need to use $(_tmpQuery.parents('tr:first')).hide();. The specific code is as follows:




Copy code

The code is as follows:

$(".del").bind("click",function(event){ //var _tmpQuery=$(this); this line The code can be deleted var id=$("input[name='id']",$(this).parents("form:first")).attr("value"); art.dialog .confirm('Are you sure to delete this log? ',function(){ $.post("myRun/managerlog_del.php",{id:id},function(tips){

if(tips=='ok'){

art. dialog.tips('Deleted successfully');
                                                                                                                                                                                                                                                5);
                                                                                                                       ; .target)





Copy code


The code is as follows:

   

   

       
• 第一行
             
  
                 
  • 这是公告标题1
  
                 
  • 这是公告标题2
  
                 
  • 这是公告标题3
  
                 
  • 这是公告标题4
  
             
  
         

   

上面的例子如果改成使用this

复制代码 代码如下:

在看一个例子

复制代码 代码如下:

<script><br>$(document).ready(function(){<br>    function handler(event) {<br>      var $target = $(event.target);<br>      if( $target.is("li") ) {<br>        $target.children().toggle();<br>      }<br>    }<br>    $("ul").click(handler).find("ul").hide();//从这里也看出find只在后代中遍历，不包括自己。<br>});<br></script>

 
• item 1
     
  
       
  • sub item 1-a
  
       
  • sub item 1-b
  
     
  
   

 
• item 2
     
  
       
  • sub item 2-a
  
       
  • sub item 2-b
  
     
  
   

The function of toggle() without parameters:

toggle has two functions:
toggle()
Switches the visible state of an element.
If the element is visible, switch to hidden; if the element is hidden, switch to visible.

toggle(fn,fn)
Toggle the function to be called each time it is clicked.
If a matching element is clicked, the specified first function is triggered, and when the same element is clicked again, the specified second function is triggered. Each subsequent click repeats the call to these two functions in turn.
Can be deleted using unbind("click").