javascript - 如何将按钮连接到预先存在的 jquery 代码

Question

我有以下 HTML:

<div class="tab-pane" id="message">
     <textarea rows="4" cols="50" id="send_message" placeholder="Enter text ..."></textarea>
     <a href="#message" class="btn btn-large btn-info"  data-toggle="tab">OK</a>
     <a href="#message" class="btn btn-large btn-info"  data-toggle="tab">Cancel</a>

我有一些预先存在的 jquery 代码，我试图链接该按钮，这样根据按钮的标题将发生一个独特的操作:

$(function(){
   $('a.btn').click(function(){

        if( $(this).is(":contains(Cancel)") ) {
            console.log("im in Cancel!!");
            $("#send_message").val("");
        }
        else if( $(this).is(":contains(OK)") )  {
               ...............

现在，当单击按钮时，我得到:

  http://localhost/myproject/#message 

当我将“this”记录到控制台时。

如何将按钮单击操作连接到 if - elseif 代码？

Answer 1

使用数据属性来提及操作并在单击时检查它。HTML:

 <a href="#message" class="btn btn-large btn-info"  data-toggle="tab" data-action="ok">OK</a>
 <a href="#message" class="btn btn-large btn-info"  data-toggle="tab" data-action="cancel">Cancel</a>

JS:

$(function(){
  $('a.btn').click(function(e){
  e.preventDefault();
    var action = $(this).data("action");
    switch(action)
   {

     case "ok":
       alert('Okay action');
       break;
     case "cancel":
       alert('Cancel action');
       break;
   }
 });
});