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); 
     }  
    }); 
})")