2017-08-08 88 views
1

在這個網站上的一些人的幫助下,我設法在這裏創建了一個hashtag計數器 - https://codepen.io/timothycdavis17/pen/ZJeVBj刪除Textarea中的重複文本

這是代碼。

HTML

<section class="section-textarea bg-primary"> 

    <div class="container"> 
    <div class="row"> 
     <div class="col-lg-12"> 
     <div class="well textarea-well clearfix"> 
      <textarea rows="16" class="form-control"></textarea> 

      <div class="buttons"> 
      <div class="btn-group" role="group" aria-label="Basic example"> 

      <button type="button" class="btn btn-secondary btn-primary btn-lg 
      count-button">Count</button> 

      <button type="button" class="btn btn-secondary btn-danger btn-lg 
      reset-button">Reset</button> 

      </div> 

     </div> 

      <div class="remaining-counter">Hashtags Counted:&nbsp;&nbsp;<span 
      class="well text-well">0</span></div> 


    </div> 

</div> 

</div> 

</div> 

</section> 

CSS

body { 
    background: #0275D8; 
} 

.textarea-well { 
    color: #000; 
    text-align: center; 
    margin: 10% auto; 
} 

textarea { 

    margin-bottom: 20px; 

} 

.text-well { 
    background: lightblue; 
} 

.count-button { 
    margin-bottom: 20px; 
} 

.remaining-counter { 
    font-size: 30px; 
    margin-bottom: 20px; 
} 

jQuery的

$(".count-button").click(function() { 
    var text = $("textarea").val(); 
    var count = (text.match(/(^|\W)(#[a-z\d A-Z\D][\w-]*)/g) || []).length; 
    $('.text-well').html(count); 

    var seen = {}; 
    $('textarea').each(function() { 
    var txt = $(this).text(); 
    if (seen[txt]) 
     $(this).remove(); 
    else 
     seen[txt] = true; 
    }); 

}).trigger('click'); 


$(".reset-button").click(function() { 
$("textarea").val(' '); 
$('.text-well').html(0); 
}).trigger('click'); 

有人提出有人問我後W不管它是否可能不會計入任何重複的標籤輸入textarea,並可能錯誤下劃線與紅色波浪線主題。

我已經看過這個網站的答案,但似乎無法找到一個工作。

任何幫助表示讚賞。

回答

1

只需使用臨時數組來過濾重複項。

// save the matches instead of immediately counting 
var tags = text.match(/(^|\W)(#[a-z\d A-Z\D][\w-]*)/g) || []; 
// init empty array for holding unique matches 
var uTags = []; 
// loop through matches 
$.each(tags, function(index, value){ 
    // if match is not in holding array array, add it to holding array 
    if(uTags.indexOf(value) == -1) uTags.push(value); 
}); 
// get count from holding array which will only have one copy of each match 
var count = uTags.length; 

Here is a fork of your codepen with the above code.

+0

非常感謝,有沒有辦法樣式重複的文字顯示這是一個重複的用戶? –

+0

當然,添加一個else塊到if語句並添加你想運行的代碼重複發現 – amflare

+0

我試圖添加一個else語句,但並不完全確定我在做什麼要誠實。我已經更新了我的代碼簿 –