javascript - 无法将 jquery .append(data) 用作 .val(append(data))

Question

我正在尝试使用 JQuery .append(data) 成功地使用它来将输入的值更改为附加数据:.val(append(data)) 但无法正常工作，而我可以成功地将值更改为 .val("Hello") 的字符串，而不是更改值以附加数据..! 所以如果有人可以帮忙请..! 这也是完整的代码:

<script type="text/javascript">
    $(document).ready(function (e) {
        $('.upload').on('submit', (function (e) {
            e.preventDefault();
            var formData = new FormData(this);

            $.ajax({
                type: 'POST',
                url: $(this).attr('action'),
                data: formData,
                cache: false,
                contentType: false,
                processData: false,
                success: function (data) {
                    $(".no_image").css("display", "none"),
                    $(".show_image").css("display", "block"),
                    $(".profile_photo").val(append(data)),
                    $(".image").attr("src", "client_images/" + append(data));
                },
                error: function (data) {
                    console.log("error");
                    console.log(data);
                }
            });
        }));

        $(".inputFile").on("change", function () {
            $(".upload").submit();
        });
    });
</script>

虽然表单代码是:

<div class="bgColor">
    <form id="uploadForm" class="upload" action="upload_image.php" method="post">
        <div id="targetLayer" class="target" style="width: 28%;height: 0%;">
            <div class="no_image" style="display:block;">No Image</div>
            <div class="show_image" style="display:none;">
                <img class="image" src="" width="100px" height="100px">
            </div>
        </div>
        <div id="uploadFormLayer">
            <label>Upload Image File:</label>
            <br/>
            <input name="userImage" id="userImage" type="file" class="inputFile" />
    </form>
    </div>
</div>
<fieldset>
    <input name="profile_photo" class="profile_photo" type="text"/>
</fieldset>

Answer 1

没有全局的 append 函数，append 是一个 jQuery 方法，即你只能在 jQuery 对象上调用它。如果您想将字符串附加到输入的当前值，您可以使用 val 的回调函数:

// ...
$(".profile_photo").val(function(index, currentValue) {
    return currentValue + data;
});
// there is no need to call a non-existent `append` function
// for string concatenation, `+` does the trick
$(".image").attr("src", "client_images/" + data);

val 方法的回调函数对 jQuery 集合中的每个元素执行一次。回调函数的第一个参数是当前迭代的index。第二个参数是元素的当前值。在上面的代码片段中，input 的当前值与 data 变量连接在一起。函数的返回值用于设置元素的值。