javascript - jquery 获取前一个值而不是当前值

Question

我无法让 jquery 获取 textarea 的当前值。我有几个帖子，每个帖子都有“撰写评论”按钮。当我选择第一篇文章的按钮时，它会显示带有第一篇文章标题和文本区域的对话框。当我在出现的文本区域中写一些内容并按提交时，它不会发出任何警报。然后我在第一篇文章上单击相同的按钮，它会显示带有第二篇文章标题的对话框，当我在文本区域中输入内容并按提交时，它会提醒我输入的文本上一个对话框。您能看一下我的代码并帮助我找出错误吗？

这是我的观点:

$data = array(
    'name' => $places_id,
    'class' => 'review',    
    'content' => 'Write a Review'    
    );
   echo form_button($data);

<div id="write_review">
  <h3><?php echo $title; ?></h3>
  <textarea rows='6' cols='90' maxlength='600' id="review_text"></textarea>
  </div>

这是我的 JS 文件:

$(document).ready(function () {
    $(".review").click(function () {
        var self = this;
        var places_id_review = $(self).attr("name");
        $("#write_review").dialog({
            title: "Write a Review",
            modal: true,
            draggable: false,
            width: 600,
            height: 300,
            buttons: [{
                text: 'Submit',
                click: function () {
                    var review_text = $("#review_text").val();
                    alert(review_text);
                    $.post('filter/post_review', {
                        places_id_review: places_id_review,
                        review_text: review_text
                    }, function (data) {
                        alert("ok")
                    }, "json");
                }
            }, {
                text: 'Cancel',
                click: function () {
                    $(this).dialog('close')
                }
            }]
        });
    });
});

Answer 1

发生这种情况是因为 DOM 中存在重复的对话框至少你可以这样得到你的值:

var review_text = $("#review_text", this).val(); //to prevent lookup in while DOM

但是你最好控制对话框的重复项(在关闭事件“close”上使用“destroy”):

$(".review").click(function () {
    var self = this;
    var places_id_review = $(self).attr("name");
    $("#write_review").dialog({
        title: "Write a Review",
        modal: true,
        draggable: false,
        width: 600,
        height: 300,
        close:function(){ $(this).dialog('destroy'); },  // DELETE dialog after close
        buttons: [{
            text: 'Submit',
            click: function () {
                $(this).dialog('close'); // do not forget close after submit
                var review_text = $("#review_text").val();
                alert(review_text);

                $.post('filter/post_review', {
                    places_id_review: places_id_review,
                    review_text: review_text
                }, function (data) {
                    alert("ok")

                }, "json");
            }
        }, {
            text: 'Cancel',
            click: function () {
                $(this).dialog('close');
            }
        }]
    });
});