Question

我的问题是当我点击我的按钮时它没有出现我的按钮点击它出现我的行点击（崩溃事件）。

我有两个按钮，一个用于打开模态，另一个用于onclick事件，但它不起作用。它是打开行崩溃事件。

我的模态打开按钮是Cevapla.Sil按钮正在删除消息，但它只是折叠行下的面板

这是我的HTML：

<tr class='accordion-toggle'  onclick='UpdateIsRead(this);' style='cursor:pointer;background-color:{6}' data-toggle='collapse' data-target='#gelenRow{0}' data-isread='{5}'>
   <td class='email-title'>{1}
   </td>
   <td class='email-body'>{2}
   </td>
   <td>{3}
   </td>
   <td>
      <a class='modalButton btn btn-info btn-xs' data-height='550' title='Cevap Yaz' data-src='{7}apps/pages/PrivateMessage.aspx?topic={8}&toWho={9}' data-title='Cevap Yaz' data-headericoncolor='#000000' data-headercolor='#000000' data-icon='fa fa-envelope' data-toggle='modal' style='cursor: pointer' data-target='#popup' style='height:28px'><span class='fa fa-edit'></span> Cevapla</a>            
      <a style='height:28px' onclick='DeleteMessage();'  title='Sil'  class='btn btn-danger btn-xs'><span class='fa fa-remove'></span> Sil</a>
   </td>
</tr>
<tr id='gelenRow{0}' class='collapse' style='background-color:#F5F5F5'>
   <td colspan='6'>
      <div class='panel-footer' style='padding: 10px 35px;'>
         <div class='row'>
            <div id='filter-panel' class='filter-panel'>
               <div class='panel panel-default'>
                  <div class='panel-body'>
                     {4}
                  </div>
               </div>
            </div>
            <button type='button' class='btn btn-sm btn-primary' >Cevap Yaz</button>
         </div>
      </div>
   </td>
</tr>

我试试这段代码：

$(document).on("click","tr", function(e){
    if (e.target.nodeName == "A" || e.target.nodeName == "SPAN") {
        e.parent().stopPropagation();
    }
});

$(document).on("click","tr", function(e){
    if (e.target.nodeName == "A" || e.target.nodeName == "SPAN") {
        e.stopPropagation();
    }
});

Answer 1

因为 DeleteMessage＆amp; UpdateIsRead 函数在HTML中内嵌，您可以考虑传递当前元素和事件：

<tr class='accordion-toggle'  onclick='UpdateIsRead(this, event);'

通过这种方式，您可以在函数中添加测试以停止传播或操作。

事件处理程序订单，单击DeleteMessage按钮是：

DeleteMessage可以
UpdateIsRead
$（文件）.on（＆＃34;点击＆＃34;，＆＃34; tr＆＃34;，...

＆＃13;

function UpdateIsRead(ele, e) {
    console.log('UpdateIsRead');
    if (e.target.nodeName == "A" || e.target.nodeName == "SPAN") {
        //e.stopPropagation();
    }
}
function DeleteMessage(ele, e) {
    console.log('DeleteMessage');
    if (e.target.nodeName == "A" || e.target.nodeName == "SPAN") {
        //e.stopPropagation();
    }
}
$(document).on("click", "tr", function(e){
    console.log('$(document).on("click", "tr"...');
    if (e.target.nodeName == "A" || e.target.nodeName == "SPAN") {
        e.stopPropagation();
    }
});

＆＃13;

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://code.jquery.com/jquery-2.1.1.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>


<table class="table table-striped">
    <tbody>
    <tr class='accordion-toggle'  onclick='UpdateIsRead(this, event);' style='cursor:pointer;background-color:{6}' data-toggle='collapse' data-target='#gelenRow0' data-isread='{5}'>
        <td class='email-title'>{1}
        </td>
        <td class='email-body'>{2}
        </td>
        <td>{3}
        </td>
        <td>
            <a class='modalButton btn btn-info btn-xs' data-height='550' title='Cevap Yaz' data-src='{7}apps/pages/PrivateMessage.aspx?topic={8}&toWho={9}' data-title='Cevap Yaz' data-headericoncolor='#000000' data-headercolor='#000000' data-icon='fa fa-envelope' data-toggle='modal' style='cursor: pointer' data-target='#popup' style='height:28px'><span class='fa fa-edit'></span> Cevapla</a>
            <a style='height:28px' onclick='DeleteMessage(this, event);'  title='Sil'  class='btn btn-danger btn-xs'><span class='fa fa-remove'></span> Sil</a>
        </td>
    </tr>
    <tr id='gelenRow0' class='collapse' style='background-color:#F5F5F5'>
        <td colspan='6'>
            <div class='panel-footer' style='padding: 10px 35px;'>
                <div class='row'>
                    <div id='filter-panel' class='filter-panel'>
                        <div class='panel panel-default'>
                            <div class='panel-body'>
                                {4}
                            </div>
                        </div>
                    </div>
                    <button type='button' class='btn btn-sm btn-primary' >Cevap Yaz</button>
                </div>
            </div>
        </td>
    </tr>
    </tbody>
</table>

＆＃13;

如果单击按钮StopPropagation按钮父行，请单击

1 个答案: