jQuery / Javascript：动态添加图片和文本

Question

Forgive me if this is a simple question, but I am kinda novice to Jquery/Javascript. What I would like to know is how I can add an image and a comment at the same time with one press on the enter key. What I mean is: a user types in a comment in a textarea, hits enter and his/her comment appears in a div together with the username. What I want is that the profile picture corresponding to that user also appears, as well as the option to rate or favourite the comment. What I have got so far is following:

$(document).ready(function() {
    $('.comment').keyup(function(e) {
        if (e.keyCode == 13){
            var post_id = $(this).attr('post_id');
            var comment = $(this).val();
            $(this).val('');
            $.post('../php_includes/comment.php', {post_id: post_id, comment: comment});
            $(this).parent().children('.comments').append("<div class='view'><?php echo $_username;?> remarks: " + comment + "</div>");     
        }
    });
});

This works. In the div "view" appears: username remarks: comment. However, when I do this:

$(document).ready(function() {
    $('.comment').keyup(function(e) {
        if (e.keyCode == 13){
        var post_id = $(this).attr('post_id');
        var comment = $(this).val();
        $(this).val('');
            $.post('../php_includes/comment.php', {post_id: post_id, comment: comment});
        $(this).parent().children('.comments').append("<div class='view'><?php echo $vis_pic;?><?php echo $_username;?> remarks: " + comment + "</div>");       
        }
    });
});

($vis_pic containing the path to the userpic) nothing happens - it does not even clear the textarea. I tried to append, prepend, declare the html in a variable - it just does not want to eat it. Also, when I add the php variable to display the rate and favourite options after adding the comment, it does nothing. This is driving me nuts as I scavenged all over Inet for a couple of days now and nothing seems to work. Again, sorry if this is a simple question. Thank you very much in advance for your efforts.

Answer 1

Instead of showing php code you should show the result of evaluating it. I think the problem is that $vis_pic contains double quotes you should escape:

<?php echo str_replace('"', '\"', $vis_pic); ?>

Maybe you could also use addslashes

Edit:

You say $vis_pic contains

$vis_pic ="<img class=\"commentpic\" src=\"../user/$_userv/mini_profilepic.jpg\">";

The problem is that you escaped the quotes for php, but when you use echo $vis_pic , php doesn't print \\ , so your code becomes:

.append("<div class='view'><img class="commentpic" src="../user/[userv]/mini_profilepic.jpg"> remarks: " + comment + "</div>");