檢查它包含的文本區域

Question

使用編輯器模板jquery我想檢查是否已添加格式的標籤，例如{title}以便稍後能夠在查看模板時替換它們。

不幸的是，或者檢查我只是糾正一個標籤，或者如果標籤前有一個單詞也表示不正確。

問題也是當使用HTML編輯器輸入標籤時，它的形式爲，並且也沒有正確驗證表單。

我試圖以某種方式克服，但不良

$('textarea').keyup(function() { 
 
    var val = this.value; 
 
    var my = $(this).val(); 
 
    if (val.search(/{event_title}/) == 0) { 
 
    $("p.eventTagTitle").addClass("true"); 
 
    } else { 
 
    $("p.eventTagTitle").removeClass("true"); 
 
    } 
 
    if (val.search('{event_form}') == 0) { 
 
    $("p.eventTagForm").addClass("true"); 
 
    } else { 
 
    $("p.eventTagForm").removeClass("true"); 
 
    } 
 
    if (val.search('{event_author}') == 0) { 
 
    $("p.eventTagAuthor").addClass("true"); 
 
    } else { 
 
    $("p.eventTagAuthor").removeClass("true"); 
 
    } \t \t \t \t \t \t \t 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
 

 
<p class="eventTag eventTagTitle">title</p> 
 
\t \t \t \t <p class="eventTag eventTagForm">form</p> 
 
\t \t \t \t <p class="eventTag eventTagAuthor">author</p> 
 
\t \t \t \t <style> 
 
\t \t \t \t .eventTag {color:red;} 
 
\t \t \t \t .eventTag.true {color:green!important;} 
 
\t \t \t \t </style> 
 

 
<textarea type="text" name="eventTemplateBody" class="form-control" id="eventTemplateBody"></textarea>

Answer 1

看看下面的解決方案：

我不得不改變綠到藍，所以我可以，如果它看到正在工作，我放棄了!important標籤。

CSS：

<style type="text/css"> 
    .eventTag { 
     color: red; 
    } 
    .eventTag.true { 
     color: blue; 
    } 
</style> 

HTML：

<p class="eventTag eventTagTitle">title</p> 
<p class="eventTag eventTagForm">form</p> 
<p class="eventTag eventTagAuthor">author</p> 
<textarea type="text" name="eventTemplateBody" class="form-control" id="eventTemplateBody"></textarea> 

JAVASCRIPT：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
<script type="text/javascript"> 

$('textarea').keyup(function() { 

    var input = $(this).val(); 

    // CHECK TITLE 
    if (input == "{event_title}") { 
     $(".eventTagTitle").addClass("true"); 
    } else { 
     $(".eventTagTitle").removeClass("true"); 
    }; 

    // CHECK FORM 
    if (input == "{event_form}") { 
     $(".eventTagForm").addClass("true"); 
    } else { 
     $(".eventTagForm").removeClass("true"); 
    }; 

    // CHECK AUTHOR 
    if (input == "{event_author}") { 
     $(".eventTagAuthor").addClass("true"); 
    } else { 
     $(".eventTagAuthor").removeClass("true"); 
    }; 

    // TEST OUTPUT TO CONSOLE 
    console.log(input); 

}); 

</script>