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 []）

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

有没有办法将这两个变量放入隐藏的输入类型？

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

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

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));

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

4 个答案: