Question

我正在使用Jquery允许用户通过表单中的Ajax上传图像（图像在实际提交表单之前上传）。我添加了为每个上传的图像添加水印的功能（这在upload_image.php中完成）这部分工作正常。

用户可以通过表格选择选择他们想要在其图像上放置水印的位置。我正在使用Jquery的.val（）来获取id =“watermark”选择的值，并将其添加为要传递给upload_image.php的查询字符串值。

问题是无论我在表单中实际选择什么，它总是传递第一个选择值。我尝试将它放在一个函数中（认为它抓住了页面加载的值）没有运气。我将选择更改为单选按钮。它仍然抓住页面上第一个单选按钮的值;无论你选择什么。

以下是处理此问题的脚本部分：

<script type="text/javascript" >
$(function(){

    // build URL to php upload script with watermark placement
    function setWatermark() {
        var uploadUrl = 'http://www.mysite.com/upload_image.php?w=';
        var watermarkValue = $('#watermark').val();
        var watermarkUrl = uploadUrl + watermarkValue;
        return watermarkUrl;
    }

    var btnUpload=$('#upload');
    new AjaxUpload(btnUpload, {
        action: setWatermark(),
        name: 'uploadfile',
    });

});
</script>

这是表格（删除了不相关的字段）：

<form id="image_form" action="this_form.php" method="post" enctype="multipart/form-data">
    <select id="watermark">
        <option value="top_left">Top Left</option>
        <option value="top_right">Top Right</option>
        <option value="center">Center</option>
        <option value="bottom_left">Bottom Left</option>
        <option value="bottom_right">Bottom Right</option>
    </select>
    <div id="upload" ><span><img src="upload_button.jpg" /></span></div>
</form>

Answer 1

执行此代码：

new AjaxUpload(btnUpload, {
    action: setWatermark(),
    name: 'uploadfile',
});

浏览器必须首先构造要传递给构造函数的参数。要构造第二个参数（对象），它必须调用setWatermark来获取action属性的值。这就是你的问题所在;在创建setWatermark对象时调用AjaxUpload。

我不知道AjaxUpload是什么，但你必须找到一种方法让它在需要action时调用函数而不是作为常量提供选项。

无论选择哪个，Jquery val（）总是抓取第一个选择值

1 个答案: