if語句中的JQuery選擇器

Question

至於上下文，在我的頁面中，當我點擊標籤時，它會過濾掉並顯示與點擊標籤對應的帖子，從這裏我需要處理分頁以轉到下一堆帖子。

但我在這裏用jQuery掙扎了javascript if聲明，在這裏我沒有設法區分點擊標籤和點擊下一個按鈕去下一頁。

最重要的是，而我點擊標籤或下一個按鈕，我需要時刻獲取相同的變量$clickTag，$catName，$page只有當我點擊標籤名稱

$clickTag價值變動和

只有

$page值的變化，如果我上單擊下一步按鈕

在我目前的狀況，第一部分是在標籤上點擊，但第二部分else時不正常if，我想抓住的頁面數量，而是它抓住文本，並將其存儲在$clickTag變量...

(function($) { 
 
    $doc = $(document); 
 

 
    $doc.ready(function() { 
 
    var $container = $('#main'); 
 
    var $pagePosts = $container.find('article'); 
 
    var $postNav = $('nav'); 
 
    var $status = $('.ajax_tag'); 
 
    var $catName = ""; 
 
    var $name = ""; 
 
    var $page = "1"; 
 
    var $clickTag = ""; 
 

 
    $("a[rel='tag']").addClass("tag"); 
 
    $pagePosts.wrapAll("<span class='my_container'></span>"); 
 

 
    var $myContainer = $('.my_container'); 
 

 
    $container.on('click', "a[rel='tag'], .pagination a", function(tag) { 
 
     event.preventDefault(); 
 
     if ($('.tag')) { 
 
     $clickTag = $(tag.target).text(); 
 
     getCatName($name); 
 
     $page = "1"; 
 
     } else { 
 
     $clickTag = $(tag.target).text(); 
 
     getCatName($name); 
 
     $page = parseInt($this.attr('href').replace(/\D/g, '')); 
 
     } 
 

 
     $params = { 
 
     'tag': $clickTag, 
 
     'cat': $catName, 
 
     'page': $page, 
 
     }; 
 

 
     get_posts($params); 
 
    }); 
 
    }); 
 
})(jQuery);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="primary" class="content-area"> 
 
    <main id="main" class="site-main" role="main"> 
 
    <span class="my_container"> 
 
     <article id="post-4996" class="post-4996 post type-post status-publish format-standard hentry category-mdu_news tag-dog"> 
 
     <header class="entry-header">MDU_TEST \t \t 
 
      <a href="http://192.168.33.10/mdu_test/mdu_news/4996" rel="bookmark">MDU – allez un petit dernier pour la route</a> 
 
      <div id="ajax_tag">TAGS:<a href="http://192.168.33.10/tag/dog" rel="tag" class="tag">dog</a> 
 
      <div class="MDU_TEST"></div> 
 
      </div> 
 
     </header> 
 
     </article> 
 
     <article id="post-4994" class="post-4994 post type-post status-publish format-standard hentry category-mdu_news tag-cat tag-dog"> 
 
     <header class="entry-header">MDU_TEST \t \t 
 
      <a href="http://192.168.33.10/mdu_test/mdu_news/4994" rel="bookmark">MDU – vu que j’ai pas mal de tags je dois faire beaucoup de posts…</a> 
 
      <div id="ajax_tag">TAGS:<a href="http://192.168.33.10/tag/cat" rel="tag" class="tag">cat</a>, <a href="http://192.168.33.10/tag/dog" rel="tag" class="tag">dog</a> 
 
      <div class="MDU_TEST"></div> 
 
      </div> 
 
     </header> 
 
     </article> 
 
    </span> 
 
    <nav class="navigation pagination" role="navigation"> 
 
     <h2 class="screen-reader-text">Posts navigation</h2> 
 
     <div class="nav-links"> 
 
     <span class="page-numbers current"> 
 
      <span class="meta-nav screen-reader-text">page </span>1 
 
     </span> 
 
     <a class="page-numbers" href="http://192.168.33.10/category/mdu_test/page/2"> 
 
      <span class="meta-nav screen-reader-text">page </span>2</a> 
 
     <a class="page-numbers" href="http://192.168.33.10/category/mdu_test/page/3"><span class="meta-nav screen-reader-text">page </span>3</a> 
 
     <a class="next page-numbers" href="http://192.168.33.10/category/mdu_test/page/2">next page</a> 
 
     </div> 
 
    </nav> 
 
    </main> 
 
</div>

Answer 1

也許是更好的檢查單擊元素的類名。 原因當您執行$ ('.tag')時，它會檢查整個頁面，而不僅僅檢查$container中的元素。

此外，如果您想訪問正在傳遞到單擊事件的函數內的當前選定元素，請使用$(this)而不是$this或$(tag.target)。這是你的$page變量爲空/未定義的主要原因。此功能的第一個參數是event，而不是選定的元素。 （jquery.on()）

(function($) { 
    $doc = $(document); 

    $doc.ready(function() { 
    var $container = $('#main'); 
    var $pagePosts = $container.find('article'); 
    var $postNav = $('nav'); 
    var $status = $('.ajax_tag'); 
    var $catName = ""; 
    var $name = ""; 
    var $page = "1"; 
    var $clickTag = ""; 

    $("a[rel='tag']").addClass("tag"); 
    $pagePosts.wrapAll("<span class='my_container'></span>"); 

    var $myContainer = $('.my_container'); 

    $container.on('click', "a[rel='tag'], .pagination a", function(event) { 
     event.preventDefault(); 
     if ($(this).hasClass('tag')) { 
     $clickTag = $(this).text(); 
     //getCatName($name); 
     $page = "1"; 
     } else { 
     $clickTag = $(this).text(); 
     //getCatName($name); 
     $page = parseInt($(this).attr('href').replace(/\D/g, '')); 
     } 

     $params = { 
     'tag': $clickTag, 
     'cat': $catName, 
     'page': $page, 
     }; 

     console.log($params) 

     //get_posts($params); 
    }); 
    });