正しいPHPメッセージにjQueryエフェクトを適用するには？

Question

私のウェブサイトでは、しばらくの間、単純なPHPメッセージシステムがあり、正常に動作し、データをMySQLに格納し、各メッセージに固有のIDが付いています。あなたがメッセージを送信したり削除したりするときに、jQueryエフェクトを追加することにしました。そのメッセージが1つだけであれば動作させることができますが、複数のメッセージがある場合、jQueryは情報をどこから取得するのか把握できません。

これは私が試して修正するために行ったことです。

$get_new_messages = mysql_query("SELECT * FROM messages WHERE to_user='$id' AND message_read = '0' ORDER BY message_id DESC"); 
    while($messages = mysql_fetch_array($get_new_messages)) 
    { 
    $message_id = $messages['message_id']; 
    $from = $messages['from_user']; 
    $from_username = $messages['from_username']; 
    $pic_from = $messages['defaultpic_from']; 
    $title = $messages['message_title']; 
    $content = $messages['message_contents']; 


    $new_messages .="<!--TITLE--> 
    <div id=\"div_$message_id\"><!-- ACCORDION ELEMNT BEGINING--> 
    <script type=\"text/javascript\"> 
    $(document).ready(function(){ 
     $(\"#reply_message_$message_id\").click(function() { 
     var to_user_$message_id = encodeURIComponent($('#to_user_$message_id').val()); 
     var from_user_$message_id = encodeURIComponent($('#from_user_$message_id').val())); 
     var defaultpic_from_$message_id = encodeURIComponent($('#defaultpic_from_$message_id').val()); 
     var defaultpic_to_$message_id = encodeURIComponent($('#defaultpic_to_$message_id').val()); 
     var your_username_$message_id = encodeURIComponent($('#your_username_$message_id').val()); 
     var message_title_$message_id = encodeURIComponent($('#message_title_$message_id').val()); 
     var message_contents_$message_id = encodeURIComponent($('#message_contents_$message_id').val()); 
     var location2 = '#div_$message_id'; 
     var location3 = '#reply_success'; 
      $.ajax({ 
       type: \"POST\", 
       url: \"send_note.php\", 
       data: {to_user:to_user_$message_id, from_user:from_user_$message_id, defaultpic_from: defaultpic_from_$message_id, defaultpic_to:defaultpic_to_$message_id, your_username:your_username_$message_id, message_title:message_title_$message_id, message_contents:message_contents_$message_id}, 
       success: 
       $(location2).fadeOut(); 
       $(location3).fadeIn(); 
      }); 
     return false; 
     }); 

     $(\"#delete_message_button_$message_id\").click(function() { 
     var deleteId = $('#deleteID_$message_id').val(); 
     var location = '#div_$message_id'; 
     var location4 = '#delete_message_success'; 
      $.ajax({ 
       type: \"POST\", 
       url: \"delete.php\", 
       data: \"deleteId=\"+ deleteId, 
       success: 
       $(location).fadeOut(); 
       $(location4).fadeIn(); 

      }); 
     return false; 
     }); 

    }); 
    </script> 
    <div class=\"title\"> 
    $title 
    </div> 
    <!--TITLE END--> 


    <div class=\"inside\"><!-- THIS DIV CONTAINS EVERYTHING INSIDE THE SELECTED ACCORDION ELEMENT--> 

<form name=\"send_note_$message_id\" id=\"$message_id\" class=\"form_right\"> 
    <input type=\"hidden\" name=\"message_id_$message_id\" id=\"message_id_$message_id\" value=\"$message_id\"> 
    <input type=\"hidden\" name=\"to_user_$message_id\" id=\"to_user_$message_id\" value=\"$from\"> 
    <input type=\"hidden\" name=\"from_user_$message_id\" id=\"from_user_$message_id\" value=\"$id\"> 
    <input type=\"hidden\" name=\"defaultpic_from_$message_id\" id=\"defaultpic_from_$message_id\" value=\"$default_pic_session\"> 
    <input type=\"hidden\" name=\"defaultpic_to_$message_id\" id=\"defaultpic_to_$message_id\" value=\"$pic_from\"> 
    <input type=\"hidden\" name=\"your_username_$message_id\" id=\"your_username_$message_id\" value=\"$username_session\"> 
    <input type=\"hidden\" name=\"message_title_$message_id\" id=\"message_title_$message_id\" value=\"$username_session Replied to your Note!\"> 
    <img class=\"pic_from_body_right\" src=\"$default_pic_session\"> 
    <textarea class=\"message_text\" name=\"message_contents_$message_id\" 

    id=\"message_contents_$message_id\" placeholder=\"Reply to $from_username here...\"></textarea> 
     <br /> 

     <p class=\"reply_delete\"> 
     <input type=\"hidden\" id=\"deleteID_$message_id\" value=\"$message_id\"> 
     <button id=\"delete_message_button_$message_id\">Delete</button> 
     <button id=\"reply_message_$message_id\">Reply</button> 
     </p> 
     </form> 
     </div> 
     </div>";  
    } 

これはメッセージを取り込んで正確にエコーします。すべて正常に動作し、jQueryの削除と応答は機能しません。それを理解できません。おそらく別のファイルにjQueryを持たせる方法はありますか？jQueryは削除する正しいメッセージを知っています。

Answer 1

私は選択肢がなければ、決してこれをやろうとしません。別の言語の文字列で別の言語のコードを書くと、デバッグの問題、構文エラーが発生することがなくなり、非常に醜いものになります。それはHTMLには受け入れられませんが、機能を壊してさらなるスクリプトを止めることができるものなら、この練習を避けるのが最善です。

HTML要素の属性に二重引用符を使用しているため、JavaScriptを外部から提供する方法が見つからない場合は、heredocsを使用することを検討します。

私はすべてのJavaScriptファイルを外部ファイルに含めてそこにメソッドを呼び出そうとします。また、PHPの二重引用符で囲まれた変数をHTMLの横に$myvarのように印刷する場合は、{$my_var}を使用することをお勧めします。これは変数としてピックアップされ、アンダースコアと次のテキスト。このエコーのソースコードを表示して、JavaScriptがそうするべきかどうかを判断できますか？ ChromeまたはFirefox（FireBug）などのJavaScriptコンソールを使用してエラーが発生していないかどうかを確認します。