Yii2 jQuery的冒泡處理阿賈克斯請求

Question

第一：我不知道我的標題是否構建得很好，我不想爲此而道歉！ 我有一個模式的形式，其中顯示所有用戶發送的消息。當我點擊消息時，應該以相同的形式通過ajax請求打開它！問題是，當我點擊一些消息，似乎有冒泡發生。刷新頁面後，有時會再次點擊最後一條消息，有時不會。不知道那是什麼行爲。會給你提供一些建議，因爲我一直在掙扎着將近1天..我想打開所選的消息。我試過event.stopImmediatePropagation()，但它每次都會打開第一條消息。

我的模態代碼：

<?php 
        Modal::begin([ 
          'header' => '<h2><em>Messages</em></h2>', 
          'headerOptions' => [ 
            'class' => 'text-center', 
           ], 
          'id' => 'modal', 
          'size' => 'modal-md', 
        ]); 

        echo "<div id='userMessages' style='border: 1px solid black'>"; 
         if(\app\controllers\UserController::getMessages()) 
         { 
          $messages = \app\controllers\UserController::getMessages(); 

          echo "<table class='table table-responsive'> 
            <thead class='text-center thead-style'> 
             <td>Title</td> 
             <td>Author</td> 
             <td>View</td> 
            </thead>"; 

          foreach ($messages as $message) 
          { 
           echo "<tr> 

             <td class='text-center'>". $message['message_title'] ."</td> 
             <td class='text-center'>". $message['message_author'] ."</td> 
             <td class='text-center'>" . Html::a('<span class=\'glyphicon glyphicon-eye-open\'></span>', 
                          ['#'], 
                          ['class' => 'view-message']); 
                    $this->registerJs("$('.view-message').on('click', function(event){ 

                     event.preventDefault(); 

                     $.ajax({ 
                      url : '". \yii\helpers\Url::to(["message", "id" => $message['message_id']]) ."', 
                      cache : false, 
                      success : function(data){ 
                       $('#userMessages').html(data); 
                      }  
                     }); 
                    })") 
             . "</td> 
             </tr>"; 
          } 

          echo "</table>"; 
         } 
        echo "</div>"; 

        Modal::end(); 
       ?> 

我ActionMessage的：

public function actionMessage($id) 
    { 
     $currMessage = UsersMessages::find()->where(['message_id' => $id])->one(); 

     return $this->renderAjax('message',[ 
      'msg' => $currMessage 
     ]); 
    } 

Answer 1

您正在添加多個點擊事件，所以只有被觸發第一次點擊事件，您只需要點擊事件，以便去除從循環js和數據屬性添加到您的按鈕與消息ID，然後將該ID添加到JavaScript並建立您的網址

foreach ($messages as $message) 
{ 
    echo "<tr> 

      <td class='text-center'>". $message['message_title'] ."</td> 
      <td class='text-center'>". $message['message_author'] ."</td> 
      <td class='text-center'>" . Html::a('<span class=\'glyphicon glyphicon-eye-open\'></span>', 
                   ['#'], 
                   ['class' => 'view-message','data-id'=> $message['message_id']]); 

      . "</td> 
      </tr>"; 
} 
$this->registerJs("$('.view-message').on('click', function(event){ 
    event.preventDefault(); 
    var id = $(this).attr('data-id'); 
    $.ajax({ 
     url : '". \yii\helpers\Url::to(["message"]) ."?id='+id, 
     cache : false, 
     success : function(data){ 
      $('#userMessages').html(data); 
     }  
    }); 
})")