javascript - 将 JavaScript 的变量放入隐藏的输入类型

Question

我有一个表单可以让用户上传图像并将图像的位置拖动到用户喜欢的位置。

我使用 jQuery 找出位置。

var top=parseFloat($("#preview_image").css('top'));
var left=parseFloat($("#preview_image").css('left'));

<form action='image.php' method='post' enctype="multipart/form-data">
<input type='file'>
<input type='submit'>
</form>

比我以正常方式发布表单，而不是使用 jQuery 发布。（因为我有 $_FILES[]）

这是问题所在。如何var top, .left从 JavaScript 发帖？

有什么方法可以将这 2 个变量放入隐藏的输入类型中？

<input type='hidden' value='top'>

所以我可以将这两个数据发布到下一页

Answer 1

尝试这样的事情：

var top=parseFloat($("#preview_image").css('top'));
var left=parseFloat($("#preview_image").css('left'));

$('#preview_image_top').val(top);
$('#preview_image_left').val(left);

<form action='image.php' method='post' enctype="multipart/form-data">
<input type='file'>
<input type='hidden' value='' name='preview_image_top' id='preview_image_top'>
<input type='hidden' value='' name='preview_image_left' id='preview_image_left'>
<input type='submit'>
</form>

Answer 2

$('form').append(
  $('<input type="hidden" name="top"').val(top),
  $('<input type="hidden" name="left"').val(left)
)

Answer 3

这将是最简单的方法。创建inputs，分配它们各自的值和名称并将它们附加到form.

var top = parseFloat($('#preview_image').css('top')),
    left = parseFloat($('#preview_image').css('left'));

$('<input>').attr({
    type: 'hidden',
    value: top,
    name: 'top'
}).appendTo('form');

$('<input>').attr({
    type: 'hidden',
    value: left,
    name: 'left'
}).appendTo('form');

Answer 4

将此代码放入您的代码中document.ready，它将起作用：

$('form').append($('<input type="hidden" name="top"').val(top),$('<input type="hidden" name="left"').val(left));