javascript - 使用 AJAX 的函数抛出 "Unexpected Token }"，Chrome 控制台

Question

这是非常不正常的。我花了 3 天的时间试图解决这个错误，但现在它并没有让我烦恼。因此，我有一个按钮和一个文本框，用于将文本框中的数据提交到 PHP 页面。数据被存储到我的数据库中。

这是 PHP 文件:

if(Class_Name::Function_Name($_POST["id"], $_POST["text"])) $data["status"] = "success";
else $data["status"] = "error";

echo json_encode($data);

这是 JS 函数:

function editPostOffer(postId, offer_id, edited_content) {
    $.post("admin/post_offer/edit_post_offer.php", {id: offer_id, text: edited_content.value}, function(data) {
        if(data.status == "success") {
            window.location.href = "post.php?id="+postId;
        } else {
            console.log("A");
        }
    }, 'json');
}

这是按钮+文本区域(在生成的表单中):

<div class="content">
    <p class="content" style="display: none;">areebaaa</p>
    <textarea class="hide span12" id="edited_content" style="display: inline-block;">areebaaa</textarea>
    <button type="button" onclick="editPostOffer(" 13 ",=" " "56 ",=" " "assa ");"="" style="display: inline-block;">Save Edits</button>&nbsp;
    <button type="button" class="hide btn btn-primary btn-small cancel_edits" style="display: inline-block;">Cancel Edits</button>
</div>

但是创建 HTML 的原始 JS 在这里:

var offers = <? php echo Class_Name::Function_Name($_GET["id"]); ?> ;
for (var i = 0; i < offers.length; i++) {
    var date = offers[i].Date.split(" ");
    document.write('<div class="row-fluid offer">' +
        '<div class="span2">' +
        '<img class="profile_picture" src="' + offers[i].Picture_Path + '" />' +
        '</div>' +
        '<div class="span10">' +
        '<div class="row-fluid">' +
        '<div class="username">' +
        '<p style="font-weight: bold;">' + offers[i].Name + '</p>' +
        '</div>' +
        '</div>' +
        '<div class="row-fluid">' +
        '<div class="content">' +
        '<p class="content">' + offers[i].Text + '</p>' +
        '<textarea class="hide span12" id="edited_content">' + offers[i].Text + '</textarea>' +
        '<button type="button" class="hide btn btn-primary btn-small" id="save_edits" onclick=' + editPostOffer("13", "56", "assa") + '>Save Edits</button>&nbsp;' +
        '<button type="button" class="hide btn btn-primary btn-small cancel_edits">Cancel Edits</button>' +
        '</div>' +
        '</div>' +
        '<div class="row-fluid">' +
        '<div class="date">' +
        '<p class="pull-right"><strong><span class="muted">Offered on: </span></strong>' + date[0] + '</p>' +
        '</div>');
    if (offers[i].Username == "<?php echo $_SESSION["
    username "]; ?>") {
        document.write('<div class="controls pull-right">' +
            '<a href="" class="no_link edit_offer">Edit</a>&nbsp;' +
            '<a href="" class="no_link" onclick="showDeleteOfferModal(' + offers[i].Offer_ID + ');">Delete</a> |&nbsp;' +
            '</div>');
    }
    document.write('</div>' +
        '</div>' +
        '</div>' +
        '<hr />');
}

我知道错误在这里:.. onclick="editPostOffer("13 ",="""56 ",="""assa ");"=""..。

EQUALTOS 和 COMMAS 混合在一起，但我不明白为什么它们会出现？有什么办法可以解决这个问题吗？

更新:

我现在已经更新了我的代码，唯一出现的错误是JS无法找到textarea

...
'<div class="content">' +
    '<p class="content">' + offers[i].Text + '</p>' +
    '<textarea class="hide span12" id="edited_content">' + offers[i].Text + '</textarea>' +
    '<button type="button" class="hide btn btn-primary btn-small" id="save_edits" onclick=\'editPostOffer("<?php echo $_GET["id"]; ?>","' + offers[i].Offer_ID + '","' + $("#edited_content") + '");\'>Save Edits</button>&nbsp;' +
    '<button type="button" class="hide btn btn-primary btn-small cancel_edits">Cancel Edits</button>' +
    '</div>' +
...

这是更新的 JS:

function editPostOffer(postId, offer_id, edited_content) {
    console.log(postId);
    console.log(offer_id);
    console.log(edited_content);
    $.post("admin/post_offer/edit_post_offer.php", {id: offer_id, text: edited_content.val()}, function(data) {
        if(data.status == "success") {
            window.location.href = "post.php?id="+postId;
        } else {
            console.log("A");
        }
    }, 'json');
}

当我将数据输出到控制台时，会出现以下情况:

13
56
Uncaught TypeError: Object [object Object] has no method 'val' 

最后一行的错误意味着该对象为空，这是因为 jQuery 无法找到文本区域。

Answer 1

不清楚您想要传递给 onclick 函数的内容，请尝试在此处使用不同/转义引号:

onclick="editPostOffer(' 13 ',\'=' ' '56 '\',\'=' ' 'assa '\');"

或

onclick="editPostOffer(' 13 ',=' ' '56 ',=' ' 'assa ');"

编辑:

在您向帖子添加更多代码后，我建议这样做:

onclick="' + editPostOffer("13", "56", "assa") + '">
        ^                                         ^ //added quotes here

关于文本区域，您正在传递 id，所以也许您应该尝试以下操作:

{id: offer_id, text: $('#'+edited_content).val()}

或

{id: offer_id, text: document.getElementById('edited_content').value}

而不是

{id: offer_id, text: edited_content.value}